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 _rowBlankAssessmentCommandLink;

export default class PageDogAssessment extends TableBasePage {
    static hash = hashPageDogAssessment;
    static attrIdRowObject = attrIdAssessment;
    callSaveTableContent = API.saveAssessmentsDistractionsAndResponses;

    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); }
    }
    getTableRecords(dirtyOnly = false) {
        dirtyOnly = true;
        let row = document.querySelector(idTableAssessment + ' tbody tr.' + flagAssessment);
        return [this.getJsonRow(row)];
    }
    getJsonRow(row) {
        console.log("getJsonRow: ", row);
        if (row == null) return;
        let inputAssessmentType = row.querySelector(idTableAssessment + ' td.' + flagAssessmentType + ' .' + flagAssessmentType);
        let inputWeather = row.querySelector(idTableAssessment + ' td.' + flagWeather + ' .' + flagWeather);
        let inputLightingLevel = row.querySelector(idTableAssessment + ' td.' + flagLightingLevel + ' .' + flagLightingLevel);
        let inputTemeratureCelcius = row.querySelector(idTableAssessment + ' td.' + flagTemperatureCelcius + ' .' + flagTemperatureCelcius);
        let inputLocation = row.querySelector(idTableAssessment + ' td.' + flagLocation + ' .' + flagLocation);
        let inputUserHandler = row.querySelector(idTableAssessment + ' td.' + flagUserHandler + ' .' + flagUserHandler);
        let inputStartOn = row.querySelector(idTableAssessment + ' td.' + flagStartOn + ' .' + flagStartOn);
        let inputEndOn = row.querySelector(idTableAssessment + ' td.' + flagEndOn + ' .' + flagEndOn);
        let inputNotes = row.querySelector(idTableAssessment + ' td.' + flagNotes + ' .' + flagNotes);
        // let buttonActive = row.querySelector(idTableAssessment + ' td.' + flagActive + ' .' + flagButton + '.' + flagIcon + '.' + flagActive);
        let idAssessment = row.getAttribute(attrIdAssessment);
        let jsonRow = {};
        jsonRow[attrIdAssessment] = idAssessment;
        jsonRow[attrIdAssessmentType] = DOM.getElementAttributeValueCurrent(inputAssessmentType);
        jsonRow[attrIdWeather] = DOM.getElementAttributeValueCurrent(inputWeather);
        jsonRow[attrIdLightingLevel] = DOM.getElementAttributeValueCurrent(inputLightingLevel);
        jsonRow[flagTemperatureCelcius] = DOM.getElementAttributeValueCurrent(inputTemeratureCelcius);
        jsonRow[attrIdLocation] = DOM.getElementAttributeValueCurrent(inputLocation);
        jsonRow[flagUserHandler] = DOM.getElementAttributeValueCurrent(inputUserHandler);
        jsonRow[flagNotes] = DOM.getElementAttributeValueCurrent(inputNotes);
        jsonRow[flagStartOn] = DOM.getElementAttributeValueCurrent(inputStartOn);
        jsonRow[flagEndOn] = DOM.getElementAttributeValueCurrent(inputEndOn);
        jsonRow[flagActive] = true; // buttonActive.classList.contains(flagDelete);
        jsonRow[flagAssessmentCommandLink] = this.getDirtyAssessmentCommandLinks(idAssessment);
        console.log({ jsonRow });
        return jsonRow;
    }
    getDirtyAssessmentCommandLinks(idAssessment) {
        let dirtyRows = document.querySelectorAll(idTableAssessmentCommandLinks + ' > tbody > tr.' + flagAssessmentCommandLink + '.' + flagDirty);
        if (dirtyRows == null || dirtyRows.length == 0) return [];
        dirtyRows = Array.from(dirtyRows);
        let dirtyRow, idAssessmentCommandLink,
            inputCommand, command,
            inputReinforcementSchedule, reinforcementSchedule,
            // inputBribe, bribe,
            inputDistanceFromHandler, distanceFromhandler,
            inputIsInHearingRangeOfHandler, isInHearingRangeOfHandler,
            inputIsInScentRangeOfHandler, isInScentRangeOfHandler,
            inputIsInSightOfHandler, isInSightOfHandler,
            inputIsOnLead, isOnLead,
            inputNotes, notes,
            buttonActive, active;
        console.log('getDirtyAssessmentCommandLinks');
        console.log({ dirtyRows });
        let dirtyLinks = [];
        for(let indexRow = 0; indexRow < dirtyRows.length; indexRow++) {
            dirtyRow = dirtyRows[indexRow];
            idAssessmentCommandLink = dirtyRow.getAttribute(attrIdAssessmentCommandLink);
            inputCommand = dirtyRow.querySelector('td.' + flagCommand + ' .' + flagCommand);
            command = DOM.getElementAttributeValueCurrent(inputCommand);
            inputReinforcementSchedule = dirtyRow.querySelector('td.' + flagReinforcementSchedule + ' .' + flagReinforcementSchedule);
            reinforcementSchedule = DOM.getElementAttributeValueCurrent(inputReinforcementSchedule);
            // inputBribe = dirtyRow.querySelector('td.' + flagBribe + ' .' + flagBribe);
            // bribe = DOM.getElementAttributeValueCurrent(inputBribe);
            inputDistanceFromHandler = dirtyRow.querySelector('td.' + flagDistanceFromHandlerMetres + ' .' + flagDistanceFromHandlerMetres);
            distanceFromhandler = DOM.getElementAttributeValueCurrent(inputDistanceFromHandler);
            inputIsInHearingRangeOfHandler = dirtyRow.querySelector('td.' + flagIsInHearingRangeOfHandler + ' .' + flagIsInHearingRangeOfHandler);
            isInHearingRangeOfHandler = DOM.getElementAttributeValueCurrent(inputIsInHearingRangeOfHandler);
            inputIsInScentRangeOfHandler = dirtyRow.querySelector('td.' + flagIsInScentRangeOfHandler + ' .' + flagIsInScentRangeOfHandler);
            isInScentRangeOfHandler = DOM.getElementAttributeValueCurrent(inputIsInScentRangeOfHandler);
            inputIsInSightOfHandler = dirtyRow.querySelector('td.' + flagIsInSightOfHandler + ' .' + flagIsInSightOfHandler);
            isInSightOfHandler = DOM.getElementAttributeValueCurrent(inputIsInSightOfHandler);
            inputIsOnLead = dirtyRow.querySelector('td.' + flagIsOnLead + ' .' + flagIsOnLead);
            isOnLead = DOM.getElementAttributeValueCurrent(inputIsOnLead);
            inputNotes = dirtyRow.querySelector('td.' + flagNotes + ' .' + flagNotes);
            notes = DOM.getElementAttributeValueCurrent(inputNotes);
            buttonActive = dirtyRow.querySelector(idTableAssessmentCommandLinks + ' td.' + flagActive + ' .' + flagButton + '.' + flagIcon + '.' + flagActive);
            active = buttonActive.classList.contains(flagDelete);
            dirtyLinks.push({
                [attrIdAssessmentCommandLink]: idAssessmentCommandLink
                , [attrIdAssessment]: idAssessment
                , [attrIdCommand]: command
                , [attrIdReinforcementSchedule]: reinforcementSchedule
                // , [attrIdBribe]: bribe
                , [flagDistanceFromHandlerMetres]: distanceFromhandler
                , [flagIsInHearingRangeOfHandler]: isInHearingRangeOfHandler
                , [flagIsInScentRangeOfHandler]: isInScentRangeOfHandler
                , [flagIsInSightOfHandler]: isInSightOfHandler
                , [flagIsOnLead]: isOnLead
                , [flagNotes]: notes
                , [flagActive]: active
                , [flagAssessmentCommandModalityLink]: this.getDirtyAssessmentCommandModalityLinks(dirtyRow, idAssessmentCommandLink)
                , [flagAssessmentCommandTechniqueLink]: this.getDirtyAssessmentCommandTechniqueLinks(dirtyRow, idAssessmentCommandLink)
                , [flagDistraction]: this.getDirtyDistractions(dirtyRow, idAssessmentCommandLink)
                , [flagAssessmentResponse]: this.getDirtyAssessmentResponses(dirtyRow, idAssessmentCommandLink)
            });
        }
        return dirtyLinks;
    }
    getDirtyAssessmentCommandModalityLinks(assessmentCommandLinkRow, idAssessmentCommandLink) {
        let assessmentCommandModalityLinkRows = assessmentCommandLinkRow.querySelectorAll(idTableAssessmentCommandModalityLinks + ' > tbody > tr.' + flagAssessmentCommandModalityLink + '.' + flagDirty);
        if (assessmentCommandModalityLinkRows == null || assessmentCommandModalityLinkRows.length == 0) return [];
        // assessmentCommandModalityLinkRows = Array.from(assessmentCommandModalityLinkRows);
        let assessmentCommandModalityLinkRow, idAssessmentCommandModalityLink,
            inputCommandModality, commandModality,
            buttonActive, active;
        console.log('getDirtyAssessmentCommandModalityLinks');
        console.log({ assessmentCommandModalityLinkRows });
        let dirtyLinks = [];
        for (let indexRow = 0; indexRow < assessmentCommandModalityLinkRows.length; indexRow++) {
            assessmentCommandModalityLinkRow = assessmentCommandModalityLinkRows[indexRow];
            idAssessmentCommandLink = assessmentCommandModalityLinkRow.getAttribute(attrIdAssessmentCommandLink);
            idAssessmentCommandModalityLink = assessmentCommandModalityLinkRow.getAttribute(attrIdAssessmentCommandModalityLink);
            inputCommand = assessmentCommandModalityLinkRow.querySelector('td.' + flagCommand + ' .' + flagCommand);
            command = DOM.getElementAttributeValueCurrent(inputCommand);
            inputCommandModality = assessmentCommandModalityLinkRow.querySelector('td.' + flagCommandModality + ' .' + flagCommandModality);
            commandModality = DOM.getElementAttributeValueCurrent(inputCommandModality);
            buttonActive = assessmentCommandModalityLinkRow.querySelector(idTableAssessmentCommandModalityLinks + ' td.' + flagActive + ' .' + flagButton + '.' + flagIcon + '.' + flagActive);
            active = buttonActive.classList.contains(flagDelete);
            dirtyLinks.push({
                [attrIdAssessmentCommandModalityLink]: idAssessmentCommandModalityLink
                , [attrIdAssessmentCommandLink]: idAssessmentCommandLink
                , [attrIdCommandModality]: commandModality
                , [flagActive]: active
            });
        }
        return dirtyLinks;
    }
    getDirtyAssessmentCommandTechniqueLinks(assessmentCommandLinkRow, idAssessmentCommandLink) {
        let assessmentCommandTechniqueLinkRows = assessmentCommandLinkRow.querySelectorAll(idTableAssessmentCommandTechniqueLinks + ' > tbody > tr.' + flagAssessmentCommandTechniqueLink + '.' + flagDirty);
        if (assessmentCommandTechniqueLinkRows == null || assessmentCommandTechniqueLinkRows.length == 0) return [];
        // assessmentCommandTechniqueLinkRows = Array.from(assessmentCommandTechniqueLinkRows);
        let assessmentCommandTechniqueLinkRow, idAssessmentCommandTechniqueLink,
            inputTrainingTechnique, trainingTechnique,
            buttonActive, active;
        console.log('getDirtyAssessmentCommandTechniqueLinks');
        console.log({ assessmentCommandTechniqueLinkRows });
        let dirtyLinks = [];
        for (let indexRow = 0; indexRow < assessmentCommandTechniqueLinkRows.length; indexRow++) {
            assessmentCommandTechniqueLinkRow = assessmentCommandTechniqueLinkRows[indexRow];
            idAssessmentCommandLink = assessmentCommandTechniqueLinkRow.getAttribute(attrIdAssessmentCommandLink);
            idAssessmentCommandTechniqueLink = assessmentCommandTechniqueLinkRow.getAttribute(attrIdAssessmentCommandTechniqueLink);
            inputCommand = assessmentCommandTechniqueLinkRow.querySelector('td.' + flagCommand + ' .' + flagCommand);
            command = DOM.getElementAttributeValueCurrent(inputCommand);
            inputTrainingTechnique = assessmentCommandTechniqueLinkRow.querySelector('td.' + flagTrainingTechnique + ' .' + flagTrainingTechnique);
            trainingTechnique = DOM.getElementAttributeValueCurrent(inputTrainingTechnique);
            buttonActive = assessmentCommandTechniqueLinkRow.querySelector(idTableAssessmentCommandTechniqueLinks + ' td.' + flagActive + ' .' + flagButton + '.' + flagIcon + '.' + flagActive);
            active = buttonActive.classList.contains(flagDelete);
            dirtyLinks.push({
                [attrIdAssessmentCommandTechniqueLink]: idAssessmentCommandTechniqueLink
                , [attrIdAssessmentCommandLink]: idAssessmentCommandLink
                , [attrIdTrainingTechnique]: trainingTechnique
                , [flagActive]: active
            });
        }
        return dirtyLinks;
    }
    getDirtyDistractions(assessmentCommandLinkRow, idAssessmentCommandLink) {
        let distractionRows = assessmentCommandLinkRow.querySelectorAll(idTableDistractions + ' tbody tr.' + flagDistraction + '.' + flagDirty);
        if (distractionRows == null || distractionRows.length == 0) return [];
        // dirtyRows = Array.from(dirtyRows);
        let distractionRow,
            inputDistractionType, distractionType,
            inputIntensityLevelEmotional, intensityLevelEmotional,
            inputIntensityLevelScent, intensityLevelScent,
            inputIntensityLevelSight, intensityLevelSight,
            inputIntensityLevelSound, intensityLevelSound,
            inputIntensityLevelTouch, intensityLevelTouch,
            inputQuantity, quantity,
            inputProximityMetres, proximityMetres,
            inputNotes, notes,
            buttonActive, active;
        console.log('getDirtyDistractions');
        console.log({ distractionRows });
        let dirtyDistractions = [];
        for(let indexRow = 0; indexRow < distractionRows.length; indexRow++) {
            distractionRow = distractionRows[indexRow];
            inputDistractionType = distractionRow.querySelector('td.' + flagDistractionType + ' .' + flagDistractionType);
            distractionType = DOM.getElementAttributeValueCurrent(inputDistractionType);
            inputIntensityLevelEmotional = distractionRow.querySelector('td.' + flagDistractionIntensityLevelEmotional + ' .' + flagDistractionIntensityLevelEmotional);
            intensityLevelEmotional = DOM.getElementAttributeValueCurrent(inputIntensityLevelEmotional);
            inputIntensityLevelScent = distractionRow.querySelector('td.' + flagDistractionIntensityLevelScent + ' .' + flagDistractionIntensityLevelScent);
            intensityLevelScent = DOM.getElementAttributeValueCurrent(inputIntensityLevelScent);
            inputIntensityLevelSight = distractionRow.querySelector('td.' + flagDistractionIntensityLevelSight + ' .' + flagDistractionIntensityLevelSight);
            intensityLevelSight = DOM.getElementAttributeValueCurrent(inputIntensityLevelSight);
            inputIntensityLevelSound = distractionRow.querySelector('td.' + flagDistractionIntensityLevelSound + ' .' + flagDistractionIntensityLevelSound);
            intensityLevelSound = DOM.getElementAttributeValueCurrent(inputIntensityLevelSound);
            inputIntensityLevelTouch = distractionRow.querySelector('td.' + flagDistractionIntensityLevelTouch + ' .' + flagDistractionIntensityLevelTouch);
            intensityLevelTouch = DOM.getElementAttributeValueCurrent(inputIntensityLevelTouch);
            inputQuantity = distractionRow.querySelector('td.' + flagQuantity + ' .' + flagQuantity);
            quantity = DOM.getElementAttributeValueCurrent(inputQuantity);
            inputProximityMetres = distractionRow.querySelector('td.' + flagProximityMetres + ' .' + flagProximityMetres);
            proximityMetres = DOM.getElementAttributeValueCurrent(inputProximityMetres);
            inputNotes = distractionRow.querySelector('td.' + flagNotes + ' .' + flagNotes);
            notes = DOM.getElementAttributeValueCurrent(inputNotes);
            buttonActive = distractionRow.querySelector(idTableDistractions + ' td.' + flagActive + ' .' + flagButton + '.' + flagIcon + '.' + flagActive);
            active = buttonActive.classList.contains(flagDelete);
            dirtyDistractions.push({
                [attrIdDistraction]: distractionRow.getAttribute(attrIdDistraction)
                , [attrIdAssessmentCommandLink]: idAssessmentCommandLink
                , [attrIdDistractionType]: distractionType
                , [flagDistractionIntensityLevelEmotional]: intensityLevelEmotional
                , [flagDistractionIntensityLevelScent]: intensityLevelScent
                , [flagDistractionIntensityLevelSight]: intensityLevelSight
                , [flagDistractionIntensityLevelSound]: intensityLevelSound
                , [flagDistractionIntensityLevelTouch]: intensityLevelTouch
                , [flagQuantity]: quantity
                , [flagProximityMetres]: proximityMetres
                , [flagNotes]: notes
                , [flagActive]: active
            });
        };
        return dirtyDistractions;
    }
    getDirtyAssessmentResponses(assessmentCommandLinkRow, idAssessmentCommandLink) {
        let assessmentResponseRows = assessmentCommandLinkRow.querySelectorAll(idTableAssessmentResponses + ' tbody tr.' + flagAssessmentResponse + '.' + flagDirty);
        if (assessmentResponseRows == null || assessmentResponseRows.length == 0) return [];
        // assessmentResponseRows = Array.from(assessmentResponseRows);
        let assessmentResponseRow,
            inputResponseQualityMetric, responseQualityMetric,
            inputObedienceLevel, obedienceLevel,
            inputValueMeasured, valueMeasured,
            inputNotes, notes,
            buttonActive, active;
        console.log('getDirtyAssessmentResponses');
        console.log({ assessmentResponseRows });
        let dirtyResponses = [];
        for(let indexRow = 0; indexRow < assessmentResponseRows.length; indexRow++) {
            assessmentResponseRow = assessmentResponseRows[indexRow];
            inputResponseQualityMetric = assessmentResponseRow.querySelector('td.' + flagResponseQualityMetric + ' .' + flagResponseQualityMetric);
            responseQualityMetric = DOM.getElementAttributeValueCurrent(inputResponseQualityMetric);
            inputObedienceLevel = assessmentResponseRow.querySelector('td.' + flagObedienceLevel + ' .' + flagObedienceLevel);
            obedienceLevel = DOM.getElementAttributeValueCurrent(inputObedienceLevel);
            inputValueMeasured = assessmentResponseRow.querySelector('td.' + flagValueMeasured + ' .' + flagValueMeasured);
            valueMeasured = DOM.getElementAttributeValueCurrent(inputValueMeasured);
            inputNotes = assessmentResponseRow.querySelector('td.' + flagNotes + ' .' + flagNotes);
            notes = DOM.getElementAttributeValueCurrent(inputNotes);
            buttonActive = assessmentResponseRow.querySelector(idTableAssessmentResponses + ' td.' + flagActive + ' .' + flagButton + '.' + flagIcon + '.' + flagActive);
            active = buttonActive.classList.contains(flagDelete);
            dirtyResponses.push({
                [attrIdAssessmentResponse]: assessmentResponseRow.getAttribute(attrIdAssessmentResponse)
                , [attrIdAssessmentCommandLink]: idAssessmentCommandLink
                , [attrIdResponseQualityMetric]: responseQualityMetric
                , [attrIdObedienceLevel]: obedienceLevel
                , [flagValueMeasured]: valueMeasured
                , [flagNotes]: notes
                , [flagActive]: active
            });
        }
        return dirtyResponses;
    }
    initialiseRowNew(tbody, row) {
        
    }
    postInitialiseRowNewCallback(tbody) {
        let newRows = tbody.querySelectorAll('tr.' + flagRowNew);
        let newestRow = newRows[0];
        let clickableElementsSelector = [
            'td.' + flagAssessmentType + ' div.' + flagAssessmentType
            , 'td.' + flagWeather + ' div.' + flagWeather
            , ',td.' + flagLightingLevel + ' div.' + flagLightingLevel
            , ',td.' + flagLocation + ' div.' + flagLocation
            , ',td.' + flagUserHandler + ' div.' + flagUserHandler
        ].join('');
        newestRow.querySelectorAll(clickableElementsSelector).forEach((clickableElement) => {
            clickableElement.click();
        });
    }
    callFilterTableContent() {
        if (assessment[attrIdAssessment] < 1) {
            let formFilters = TableBasePage.getFormFilters();
            let filterAssessment = formFilters.querySelector('#' + attrIdAssessment);
            DOM.setElementValueCurrent(filterAssessment, '');
        }
        super.callFilterTableContent();
    }

    hookupTableMain() {
        super.hookupTableMain();
        this.hookupTableAssessmentHeader();
        this.hookupTableAssessmentCommandLinks();
    }
    hookupTableAssessmentHeader() {
        this.hookupTableAssessmentFieldAssessmentType();
        this.hookupTableAssessmentFieldWeather();
        this.hookupTableAssessmentFieldLightingLevel();
        this.hookupTableAssessmentFieldTemperature();
        this.hookupTableAssessmentFieldLocation();
        this.hookupTableAssessmentFieldUserHandler();
        this.hookupTableAssessmentFieldStartOn();
        this.hookupTableAssessmentFieldEndOn();
        this.hookupTableAssessmentFieldNotes();
        if (assessment[attrIdAssessment] < 1) {
            let tbody = document.querySelector(idTableAssessment + ' tbody');
            let row = tbody.querySelector('tr');
            row.classList.add(flagRowNew);
            this.postInitialiseRowNewCallback(tbody);
        }
    }
    hookupTableAssessmentFieldAssessmentType() {
        let fieldFlag = flagAssessmentType;
        let optionList = Utils.getListFromDict(filterAssessmentTypes);
        let cellSelector = idTableAssessment + ' td.' + flagAssessmentType;
        this.hookupTableCellDdlPreviews(
            fieldFlag
            , optionList
            , cellSelector
        );
    }
    hookupTableAssessmentFieldWeather() {
        let fieldFlag = flagWeather;
        let optionList = Utils.getListFromDict(filterWeathers);
        let cellSelector = idTableAssessment + ' td.' + flagWeather;
        this.hookupTableCellDdlPreviews(
            fieldFlag
            , optionList
            , cellSelector
        );
    }
    hookupTableAssessmentFieldLightingLevel() {
        let fieldFlag = flagLightingLevel;
        let optionList = Utils.getListFromDict(filterLightingLevels);
        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);
        let cellSelector = idTableAssessment + ' td.' + flagLocation;
        this.hookupTableCellDdlPreviews(
            fieldFlag
            , optionList
            , cellSelector
        );
    }
    hookupTableAssessmentFieldUserHandler() {
        let fieldFlag = flagUserHandler;
        let optionList = Utils.getListFromDict(filterUserHandlers);
        let cellSelector = idTableAssessment + ' td.' + flagUserHandler;
        this.hookupTableCellDdlPreviews(
            fieldFlag
            , optionList
            , cellSelector
        );
    }
    hookupTableAssessmentFieldStartOn() {
        this.hookupChangeHandlerTableCells(idTableAssessment + ' td.' + flagStartOn + ' .' + flagStartOn);
    }
    hookupTableAssessmentFieldEndOn() {
        this.hookupChangeHandlerTableCells(idTableAssessment + ' td.' + flagEndOn + ' .' + flagEndOn);
    }
    hookupTableAssessmentFieldNotes() {
        this.hookupChangeHandlerTableCells(idTableAssessment + ' td.' + flagNotes + ' .' + flagNotes);
    }
    hookupTableAssessmentCommandLinks() {
        Events.initialiseEventHandler(idTableAssessmentCommandLinks, flagInitialised, (table) => {
            let selectorRowNew = idTableAssessmentCommandLinks + ' tbody tr.' + flagRowNew;
            let rowBlankTemp = document.querySelector(selectorRowNew);
            Utils.consoleLogIfNotProductionEnvironment("row blank temp: ", rowBlankTemp);
            let countRows = document.querySelectorAll(idTableAssessmentCommandLinks + ' > tbody > tr').length;
            _rowBlankAssessmentCommandLink = rowBlankTemp.cloneNode(true);
            document.querySelectorAll(selectorRowNew).forEach(function(row) {
                row.remove();
            });
            _rowBlankAssessmentCommandLink.setAttribute(attrIdAssessmentCommandLink, -1 - countRows);
        });

        this.hookupTableAssessmentCommandLinksFieldsCommandCategory();
        this.hookupTableAssessmentCommandLinksFieldsCommand();
        this.hookupTableAssessmentCommandLinksFieldsReinforcementSchedule();
        this.hookupTableAssessmentCommandLinksFieldsDistanceFromHandlerMetres();
        this.hookupTableAssessmentCommandLinksFieldsIsInHearingRangeOfHandler();
        this.hookupTableAssessmentCommandLinksFieldsIsInScentRangeOfHandler();
        this.hookupTableAssessmentCommandLinksFieldsIsInSightOfHandler();
        this.hookupTableAssessmentCommandLinksFieldsIsOnLead();
        this.hookupTableAssessmentCommandLinksFieldsNotes();
        this.hookupTableAssessmentCommandLinksFieldsCommandModalities();
        this.hookupTableAssessmentCommandLinksFieldsTrainingTechniques();
        this.hookupTableAssessmentCommandLinksFieldsTrialCount();
        this.hookupTableAssessmentCommandLinksFieldsResponses();
        this.hookupTableAssessmentCommandLinksFieldsActive();
    }
    hookupTableAssessmentCommandLinksFieldsCommandCategory() {
        this.hookupFieldsCommandCategory(idTableAssessmentCommandLinks);
        /*
        let fieldFlag = flagCommandCategory;
        let optionList = Utils.getListFromDict(filterCommandCategories).sort((a, b) => a[flagName].localeCompare(b[flagName]));
        let cellSelector = idTableAssessmentCommandLinks + ' td.' + flagCommandCategory;
        this.hookupTableCellDdlPreviews(
            fieldFlag
            , optionList
            , cellSelector
            , (tdSelector) => { this.hookupTableAssessmentCommandLinksDdlsCommandCategory(tdSelector); }
            , (event, element) => { this.handleChangeTableAssessmentCommandModalityLinksDdlCommandCategory(event, element); }
        );
        */
    }
    /*
    hookupTableAssessmentCommandLinksDdlsCommandCategory(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);
    }
    */
    hookupTableAssessmentCommandLinksFieldsCommand() {
        this.hookupFieldsCommand(idTableAssessmentCommandLinks);
    }
    hookupTableAssessmentCommandLinksFieldsReinforcementSchedule() {
        let fieldFlag = flagReinforcementSchedule;
        let optionList = Utils.getListFromDict(filterReinforcementSchedules);
        let cellSelector = idTableAssessmentCommandLinks + ' td.' + flagReinforcementSchedule;
        this.hookupTableCellDdlPreviews(
            fieldFlag
            , optionList
            , cellSelector
        );
    }
    /*
    hookupTableAssessmentCommandLinksFieldsBribe() {
        let fieldFlag = flagBribe;
        let optionList = Utils.getListFromDict(filterBribes); // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
        let cellSelector = idTableAssessmentCommandLinks + ' td.' + flagBribe;
        this.hookupTableCellDdlPreviews(
            fieldFlag
            , optionList
            , cellSelector
        );
    }
    */
    hookupTableAssessmentCommandLinksFieldsDistanceFromHandlerMetres() {
        this.hookupChangeHandlerTableCells(idTableAssessmentCommandLinks + ' td.' + flagDistanceFromHandlerMetres + ' .' + flagDistanceFromHandlerMetres);
    }
    hookupTableAssessmentCommandLinksFieldsIsInHearingRangeOfHandler() {
        this.hookupChangeHandlerTableCells(idTableAssessmentCommandLinks + ' td.' + flagIsInHearingRangeOfHandler + ' .' + flagIsInHearingRangeOfHandler);
    }
    hookupTableAssessmentCommandLinksFieldsIsInScentRangeOfHandler() {
        this.hookupChangeHandlerTableCells(idTableAssessmentCommandLinks + ' td.' + flagIsInScentRangeOfHandler + ' .' + flagIsInScentRangeOfHandler);
    }
    hookupTableAssessmentCommandLinksFieldsIsInSightOfHandler() {
        this.hookupChangeHandlerTableCells(idTableAssessmentCommandLinks + ' td.' + flagIsInSightOfHandler + ' .' + flagIsInSightOfHandler);
    }
    hookupTableAssessmentCommandLinksFieldsIsOnLead() {
        this.hookupChangeHandlerTableCells(idTableAssessmentCommandLinks + ' td.' + flagIsOnLead + ' .' + flagIsOnLead);
    }
    hookupTableAssessmentCommandLinksFieldsTrialCount() {
        // this.hookupChangeHandlerTableCells(idTableAssessmentCommandLinks + ' td.' + flagTrialCount + ' .' + flagTrialCount);
    }
    hookupTableAssessmentCommandLinksFieldsNotes() {
        this.hookupChangeHandlerTableCells(idTableAssessmentCommandLinks + ' > tbody > tr > td.' + flagNotes + ' .' + flagNotes);
    }


    hookupTableAssessmentCommandLinksFieldsCommandModalities() {
        this.hookupTableAssessmentCommandLinksCommandModalityPreviews();
        this.hookupTableAssessmentCommandLinksCommandModalityCheckboxes();
    }
    hookupTableAssessmentCommandLinksCommandModalityPreviews() {
        let eventType = "click";
        let selector = idTableAssessmentCommandLinks + ' td.' + flagAssessmentCommandModalityLink + ' div.' + flagAssessmentCommandModalityLink;
        let handler = (event, element) => {
            let parentTd = DOM.getCellFromElement(element);
            let rowAssessmentCommandLink = parentTd.closest('tr.' + flagAssessmentCommandLink);
            let idAssessmentCommandLink = rowAssessmentCommandLink.getAttribute(attrIdAssessmentCommandLink);
            let assessmentCommandLinksFiltered = assessment[flagAssessmentCommandLink].filter(link => link[attrIdAssessmentCommandLink] == idAssessmentCommandLink);
            let assessmentCommandLink = (assessmentCommandLinksFiltered == null || assessmentCommandLinksFiltered.length == 0) ? null : assessmentCommandLinksFiltered[0];
            let assessmentCommandModalityLinks = (assessmentCommandLink == null) ? null : assessmentCommandLink[flagAssessmentCommandModalityLink];
            Utils.consoleLogIfNotProductionEnvironment({ assessmentCommandLinksFiltered, assessmentCommandModalityLinks });
            
            let commandModalityContainer = document.createElement('div');
            commandModalityContainer.classList.add(flagContainer);
            commandModalityContainer.classList.add(flagColumn);

            let commandModality, active, row;
            for (let keyCommandModality in Object.keys(filterCommandModalities)) {
                commandModality = filterCommandModalities[keyCommandModality];
                active = assessmentCommandModalityLinks.filter(l => {
                    l[attrIdCommandModality] == commandModality[attrIdCommandModality]
                    && l[flagActive]
                }).length > 0;
                row = PageDogAssessment.createNewRowAssessmentCommandModalityLink(commandModality, active);
                commandModalityContainer.appendChild(row);
            }

            parentTd.innerHTML = commandModalityContainer.outerHTML;

            this.hookupTableAssessmentCommandLinksFieldsCommandModalities();
        };
        Events.hookupEventHandler(
            eventType
            , selector
            , handler
        );
        this.hookupTableAssessmentCommandLinksFieldsCommandModalities();
    }
    static createNewRowAssessmentCommandModalityLink(commandModality, active) {
        if (commandModality == null) commandModality = {
            [attrIdAssessmentCommandModalityLink]: null
            , [attrIdAssessmentCommandLink]: null
            , [attrIdCommandModality]: 0
            , [flagCode]: ''
            , [flagName]: ''
            , [flagDescription]: ''
            , [flagActive]: true
        };
        console.log({ commandModality });
        let isNew = (commandModality[attrIdAssessmentCommandModalityLink] == null || commandModality[attrIdAssessmentCommandModalityLink] < 1);
        let row = document.createElement("div");
        row.classList.add(flagAssessmentCommandModalityLink);
        row.classList.add(flagCommandModality);
        row.classList.add(flagContainer);
        row.classList.add(flagRow);
        if (isNew) row.classList.add(flagRowNew);
        row.setAttribute(attrIdAssessmentCommandModalityLink, commandModality[attrIdAssessmentCommandModalityLink]);

        let checkboxCommandModality = document.createElement("input");
        checkboxCommandModality.type = 'checkbox';
        checkboxCommandModality.classList.add(flagAssessmentCommandModalityLink);
        checkboxCommandModality.classList.add(flagCommandModality);
        checkboxCommandModality.setAttribute(attrIdCommandModality, commandModality[attrIdCommandModality]);
        // checkboxCommandModality.value = active;
        DOM.setElementValuesCurrentAndPrevious(checkboxCommandModality, active);
        
        let labelCommandModality = document.createElement('label');
        labelCommandModality.innerHTML = checkboxCommandModality.outerHTML + commandModality[flagName];
        labelCommandModality.setAttribute('alt', commandModality[flagDescription]);

        row.appendChild(labelCommandModality);
        return row;
    }
    hookupTableAssessmentCommandLinksCommandModalityCheckboxes() {
        let eventType = "click";
        let selector = idTableAssessmentCommandLinks + ' td.' + flagAssessmentCommandModalityLink + ' label'; // input[type="checkbox"].' + flagAssessmentCommandModalityLink;
        let handler = (event, element) => {
            let parentTd = DOM.getCellFromElement(element);
            
            let wasDirtyParentRows = this.getAllIsDirtyRowsInParentTree(element);
            let wasDirtyElement = element.classList.contains(flagDirty);


            let isDirtyElement = DOM.updateAndCheckIsElementDirty(element);
            if (isDirtyElement != wasDirtyElement) {

                /*
                let rowAssessmentCommandLink = parentTd.closest('tr.' + flagAssessmentCommandLink);
                let idAssessmentCommandLink = rowAssessmentCommandLink.getAttribute(attrIdAssessmentCommandLink);
                */
                let checkboxesCommandModality = parentTd.querySelectorAll('input[type="checkbox"]');
                let checkboxCommandModality, idCommandModality;
                let newCommandModalityLinkCsv = '';
                for (let indexCheckbox = 0; indexCheckbox < checkboxesCommandModality.length; indexCheckbox++) {
                    checkboxCommandModality = checkboxesCommandModality[indexCheckbox];
                    if (DOM.getElementValueCurrent(checkboxCommandModality)) {
                        idCommandModality = checkboxCommandModality.getAttribute(attrIdCommandModality);
                        newCommandModalityLinkCsv = newCommandModalityLinkCsv + ',' + idCommandModality;
                    }
                }
    
                this.updateAndToggleShowButtonsSaveCancel();
                this.cascadeChangedIsDirtyNestedElementCellTable(element, isDirtyElement, wasDirtyParentRows);
            }
        };
        Events.hookupEventHandler(
            eventType
            , selector
            , handler
        );
    }

    hookupTableAssessmentCommandLinksFieldsResponses() {
        let eventType = "click";
        let selector = idTableAssessmentCommandLinks + ' td.' + flagAssessmentResponse + ' div.' + flagAssessmentResponse;
        let handler = (event, element) => {
            let parentTd = DOM.getCellFromElement(element);
            let rowAssessmentCommandLink = parentTd.closest('tr.' + flagAssessmentCommandLink);
            let idAssessmentCommandLink = rowAssessmentCommandLink.getAttribute(attrIdAssessmentCommandLink);
            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 assessmentCommandLinks = assessment[flagAssessmentCommandLink].filter(link => link[attrIdAssessmentCommandLink] == idAssessmentCommandLink);
            let assessmentCommandLink = (assessmentCommandLinks == null || assessmentCommandLinks.length == 0) ? null : assessmentCommandLinks[0];
            let responses = (assessmentCommandLink == null) ? null : assessmentCommandLink[flagAssessmentResponse];
            
            console.log({ assessmentCommandLinks, responses });
            if (responses != null && responses.length > 0) {
                for (let responseKey in Object.keys(responses)) {
                    let response = responses[responseKey];
                    let row = PageDogAssessment.createNewRowTableAssessmentResponses(response);
                    body.appendChild(row);
                }
            }
            responsesTable.appendChild(body);

            parentTd.innerHTML = responsesTable.outerHTML;

            let responseRows = parentTd.querySelectorAll('tbody tr.' + flagAssessmentResponse);
            if (responseRows != null && responseRows.length > 0) {
                for (let indexRow = 0; indexRow < responseRows.length; indexRow++) {
                    let row = responseRows[indexRow];
                    // let idAssessmentResponse = row.getAttribute(attrIdAssessmentResponse);
                    
                    let response = responses[indexRow]; // idAssessmentResponse];
                    console.log({ indexRow, row, response }); // idAssessmentResponse,
                    let inputValueMeasured = row.querySelector('td.' + flagValueMeasured + ' .' + flagValueMeasured);
                    DOM.setElementValueCurrent(inputValueMeasured, response[flagValueMeasured]);
                    let inputNotes = row.querySelector('td.' + flagNotes + ' .' + flagNotes);
                    DOM.setElementValueCurrent(inputNotes, response[flagNotes]);
                }
            }

            this.hookupTablesAssessmentResponses();
        };
        Events.hookupEventHandler(
            eventType
            , selector
            , handler
        );
        this.hookupTablesAssessmentResponses();
    }
    static createNewRowTableAssessmentResponses(response) {
        if (response == null) response = {
            [attrIdAssessmentResponse]: null
            , [attrIdResponseQualityMetric]: {
                [attrIdResponseQualityMetric]: 0
            }
            , [attrIdObedienceLevel]: {
                [attrIdObedienceLevel]: 0
            }
            , [flagValueMeasured]: ''
            , [flagNotes]: ''
            , [flagActive]: true
        };
        console.log({ response });
        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);
        let idResponseQualityMetric = response[attrIdResponseQualityMetric][attrIdResponseQualityMetric];
        let responseQualityMetric = filterResponseQualityMetrics[idResponseQualityMetric];
        DOM.setElementAttributesValuesCurrentAndPrevious(divResponseQualityMetric, idResponseQualityMetric);
        divResponseQualityMetric.innerText = (responseQualityMetric == null) ? '' : responseQualityMetric[flagName];
        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);
        let idObedienceLevel = response[attrIdObedienceLevel][attrIdObedienceLevel];
        let obedienceLevel = filterObedienceLevels[idObedienceLevel];
        DOM.setElementAttributesValuesCurrentAndPrevious(divObedienceLevel, idObedienceLevel);
        divObedienceLevel.innerText = (obedienceLevel == null) ? '' : obedienceLevel[flagName];
        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);
        let valueMeasured = response[flagValueMeasured];
        DOM.setElementValueCurrent(inputValueMeasured, valueMeasured);
        DOM.setElementAttributeValuePrevious(inputValueMeasured, valueMeasured);
        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);
        let notes = response[flagNotes];
        DOM.setElementValueCurrent(inputNotes, notes);
        DOM.setElementAttributeValuePrevious(inputNotes, notes);
        tdNotes.appendChild(inputNotes);
        row.appendChild(tdNotes);

        console.log(inputValueMeasured.tagName);
        console.log(inputNotes.tagName);
        console.log({ valueMeasured, notes });

        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(idTableAssessmentResponses + ' > 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 rowAssessmentCommandLink = DOM.getRowFromElement(tbody);
        let divTrialCount = rowAssessmentCommandLink.querySelector('td.' + flagTrialCount + ' div.' + flagTrialCount);
        divTrialCount.innerText = countActiveRows;
    }

    hookupTableAssessmentCommandLinksFieldsActive() {
        this.hookupFieldsActive(flagAssessmentCommandLink, (event, element) => { this.handleClickAddRowTableAssessmentCommandLinks(event, element); });
    }
    handleClickAddRowTableAssessmentCommandLinks(event, button) {
        event.stopPropagation();
        _rowBlankAssessmentCommandLink.setAttribute(attrIdAssessmentCommandLink, -1 - _rowBlankAssessmentCommandLink.getAttribute(attrIdAssessmentCommandLink));
        let tbody = document.querySelector(idTableAssessmentCommandLinks + ' tbody');
        if (tbody.classList.contains(flagIsCollapsed)) return;
        let row = _rowBlankAssessmentCommandLink.cloneNode(true);
        row.classList.remove(flagInitialised);
        row.querySelectorAll('.' + flagInitialised).forEach(function(element) {
            element.classList.remove(flagInitialised);
        });
        let countRows = document.querySelectorAll(idTableAssessmentCommandLinks + ' > tbody > tr').length;
        row.setAttribute(attrIdAssessmentCommandLink, -1 - countRows);
        tbody.prepend(row);
        tbody.scrollTop = 0;
        this.hookupTableAssessmentCommandLinks();
        this.postInitialiseAssessmentCommandLinkRowNewCallback(tbody);
    }
    postInitialiseAssessmentCommandLinkRowNewCallback(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();
        });
    }

    /*

    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();
        });
    }
    */

    leave() {
        super.leave();
    }
}