document.addEventListener("DOMContentLoaded", function () {
    doInit()
})

function doInit() {
    createTable(buildings, 'list');
    const clearFiltersButton = document.getElementById("clearFiltersButton");
    clearFiltersButton.addEventListener("click", (event) => {
        clearFilters(filter);
        filterTable(buildings,'list',filter)
        resetSort(sort);
    })

    const applyFiltersButton = document.getElementById("applyFiltersButton");
    applyFiltersButton.addEventListener("click", (event) => {
        filterTable(buildings,'list',filter)
        resetSort(sort);
    })

    setSortSelects(buildings[0], sort)


    sort.fieldsFirst.addEventListener("change",()=>{
        changeNextSelect(sort.fieldsFirst,sort.fieldsSecond.id)
    })
    
    sort.doSortButton.addEventListener("click", ()=>{if (!sortTable('list',sort)){
        clearTable('list');
        createTable(buildings, 'list');
    }});
    sort.resetSortButton.addEventListener("click", ()=>{resetSort(sort);
                clearTable('list');
        createTable(buildings, 'list');
    });

}

// формирование полей элемента списка с заданным текстом и значением

const createOption = (str, val) => {
    let item = document.createElement('option');
    item.text = str;
    item.value = val;
    return item;
}

// формирование поля со списком 
// параметры – массив со значениями элементов списка и элемент select

const setSortSelect = (arr, sortSelect) => {
    
    // создаем OPTION Нет и добавляем ее в SELECT
    sortSelect.append(createOption('Нет', 0));
    // перебираем массив со значениями опций
     arr.forEach((item, index) => {
       // создаем OPTION из очередного ключа и добавляем в SELECT
       // значение атрибута VALUE увеличиваем на 1, так как значение 0 имеет опция Нет
        sortSelect.append(createOption(item, index + 1));
    });
}
// формируем поля со списком для многоуровневой сортировки
const setSortSelects = (data, dataForm) => { 

    // выделяем ключи словаря в массив
    const head = Object.keys(data);

    // находим все SELECT в форме
    const allSelect = dataForm.getElementsByTagName('select');
    
    for(const item of dataForm.elements){
        // формируем очередной SELECT
        setSortSelect(head, item);
		
        // САМОСТОЯТЕЛЬНО все SELECT, кроме первого, сделать неизменяемым
    }
    let skipped = false
    for(const elem of allSelect){
        if(!skipped){
            skipped = true;
            continue;
        }
        elem.disabled = true;
    }
}

const changeNextSelect = (curSelect, nextSelectId) => {
    
    let nextSelect = document.getElementById(nextSelectId);
    
    nextSelect.disabled = false;
    
    // в следующем SELECT выводим те же option, что и в текущем
    nextSelect.innerHTML = curSelect.innerHTML;
    
    // удаляем в следующем SELECT уже выбранную в текущем опцию
    // если это не первая опция - отсутствие сортировки
    if (curSelect.value != 0) {
       nextSelect.remove(curSelect.value);
    } else {
        nextSelect.disabled = true;
    }
}

const resetSort = (form)=>{
    form.querySelectorAll(`& select`).forEach((curSelect,index) =>  {if(index!=0){curSelect.disabled = true} curSelect.value = 0})
}