dog_training/static/js/pages/dog/assessments.js

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

export default class PageDogAssessments extends TableBasePage {
    static hash = hashPageDogAssessments;
    static attrIdRowObject = attrIdAssessment;
    callSaveTableContent = API.saveAssessments;

    constructor(router) {
        super(router);
        this.dogMixin = new DogTableMixinPage(this);
    }

    initialize() {
        this.sharedInitialize();
    }

    hookupFilters() {
        this.sharedHookupFilters();
        this.hookupFilterWeather();
        this.hookupFilterLightingLevel();
        this.hookupFilterLocation();
        this.hookupFilterHandler();
        this.hookupFilterActive();
    }
    hookupFilterWeather() {
        this.hookupFilter(attrIdWeather);
    }
    hookupFilterLightingLevel() {
        this.hookupFilter(attrIdLightingLevel);
    }
    hookupFilterHandler() {
        this.hookupFilter(flagUserHandler);
    }

    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 inputNotes = row.querySelector('td.' + flagNotes + ' textarea');
        let buttonActive = row.querySelector('td.' + flagActive + ' .' + flagActive);

        let jsonRow = {};
        jsonRow[attrIdAssessment] = row.getAttribute(attrIdAssessment);
        jsonRow[attrIdWeather] = this.getIdWeatherRow(row);
        jsonRow[attrIdLightingLevel] = this.getIdLightingLevelRow(row);
        jsonRow[flagTemperatureCelcius] = DOM.getElementAttributeValueCurrent(inputTemperatureCelcius);
        jsonRow[attrIdLocation] = this.getIdLocationRow(row);
        jsonRow[flagUserHandler] = this.getIdUserHandlerRow(row);
        jsonRow[flagNotes] = DOM.getElementAttributeValueCurrent(inputNotes);
        jsonRow[flagActive] = buttonActive.classList.contains(flagDelete);
        return jsonRow;
    }
    getIdWeatherRow(tr) {
        let elementWeather = tr.querySelector('td.' + flagWeather + ' .' + flagWeather);
        return DOM.getElementAttributeValueCurrent(elementWeather);
    }
    getIdLightingLevelRow(tr) {
        let elementLightingLevel = tr.querySelector('td.' + flagLightingLevel + ' .' + flagLightingLevel);
        return DOM.getElementAttributeValueCurrent(elementLightingLevel);
    }
    getIdLocationRow(tr) {
        let elementLocation = tr.querySelector('td.' + flagLocation + ' .' + flagLocation);
        return DOM.getElementAttributeValueCurrent(elementLocation);
    }
    getIdUserHandlerRow(tr) {
        let elementUserHandler = tr.querySelector('td.' + flagUserHandler + ' .' + flagUserHandler);
        return DOM.getElementAttributeValueCurrent(elementUserHandler);
    }
    initialiseRowNew(tbody, row) {
        
    }
    postInitialiseRowNewCallback(tbody) {
        let newRows = tbody.querySelectorAll('tr.' + flagRowNew);
        let newestRow = newRows[0];
        let clickableElementsSelector = [
            'td.' + flagDetail + ' .' + flagDetail
        ].join('');
        let detailButton = newestRow.querySelector('td.' + flagDetail + ' .' + flagDetail); /*.forEach((clickableElement) => {
            clickableElement.
            clickableElement.click();
        });
        */
        newestRow.classList.add(flagIsCollapsed);
        detailButton.click();
        // console.log({ newestRow, detailButton });
    }

    hookupTableMain() {
        super.hookupTableMain();
        this.hookupFieldsDetail();
        this.hookupFieldsWeather();
        this.hookupFieldsLightingLevel();
        this.hookupFieldsTemperature();
        this.dogMixin.hookupFieldsLocation();
        this.hookupFieldsHandler();
        this.hookupFieldsNotesTable();
        this.hookupFieldsActive();
    }
    hookupFieldsDetail() {
        Events.hookupEventHandler(
            "click" // eventType
            , idTableMain + ' td.' + flagDetail + ' button.' + flagDetail // selector
            , (event, element) => {
                let parentTr = DOM.getRowFromElement(element);
                let idAssessment = parentTr.getAttribute(attrIdAssessment);
                /*
                console.log("click detail");
                console.log({ element, parentTr, idAssessment });
                const data = {};
                const params = {
                    [attrIdAssessment]: idAssessment
                };
                API.request(
                    hashPageDogAssessment // hashEndpoint
                    , 'GET' // method
                    , data
                    , params
                );
                */

                let formFilters = TableBasePage.getFormFilters();
                let filtersJson = DOM.convertForm2JSON(formFilters);
                filtersJson[attrIdAssessment] = idAssessment;
                Utils.consoleLogIfNotProductionEnvironment("hookupFieldsDetail");
                Utils.consoleLogIfNotProductionEnvironment("formFilters");
                Utils.consoleLogIfNotProductionEnvironment(formFilters);
                Utils.consoleLogIfNotProductionEnvironment("filtersJson");
                Utils.consoleLogIfNotProductionEnvironment(filtersJson);
                this.leave();
                API.goToHash(hashPageDogAssessment, filtersJson);
            }
        );
    }
    hookupFieldsWeather() {
        this.hookupTableCellDdlPreviews(
            flagWeather
            , Utils.getListFromDict(filterWeathers) // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
        );
    }
    hookupFieldsLightingLevel() {
        this.hookupTableCellDdlPreviews(
            flagLightingLevel
            , Utils.getListFromDict(filterLightingLevels) // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
        );
    }
    hookupFieldsTemperature() {
        this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagTemperatureCelcius + ' input.' + flagTemperatureCelcius);
    }
    hookupFieldsHandler() {
        this.hookupTableCellDdlPreviews(
            flagUserHandler
            , Utils.getListFromDict(filterUserHandlers) // .sort((a, b) => a[flagName].localeCompare(b[flagName]))
        );
    }

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