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

check-all-checkbox: remove caching idea

Browse Source
This commit is contained in:
Felix Hamann 2019-02-22 21:58:21 +01:00
parent 4fd23e9497
commit 05733ec85b
1 changed files with 34 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
static/js/utils/checkAll.js
View File

@ -1,4 +1,4 @@
(function collonadeClosure() {
(function() {
'use strict';
window.utils = window.utils || {};
@ -20,17 +20,12 @@
var columns = [];
var checkboxColumn = [];
var checkAllCheckbox = null;
var lastInputWasCheckAllCheckbox = false;
function init() {
columns = gatherColumns(wrapper);
var checkboxColumnId = findCheckboxColumn(columns);
if (checkboxColumnId !== null) {
checkboxColumn = columns[checkboxColumnId];
setupCheckAllCheckbox(checkboxColumnId);
}
setupCheckAllCheckbox(findCheckboxColumn(columns));
wrapper.classList.add(JS_INITIALIZED_CLASS);
}
@ -40,24 +35,24 @@
var cols = [];
rows.forEach(function(tr) {
var cells = Array.from(tr.querySelectorAll('td'));
cells.forEach(function(cell, iCell) {
if (!cols[iCell]) {
cols[iCell] = [];
cells.forEach(function(cell, cellIndex) {
if (!cols[cellIndex]) {
cols[cellIndex] = [];
}
cols[iCell].push(cell);
cols[cellIndex].push(cell);
});
});
return cols;
}
function findCheckboxColumn(cols) {
var checkboxColumn = null;
cols.forEach(function(col, i) {
function findCheckboxColumn(columns) {
var checkboxColumnId = null;
columns.forEach(function(col, i) {
if (isCheckboxColumn(col)) {
checkboxColumn = i;
checkboxColumnId = i;
}
});
return checkboxColumn;
return checkboxColumnId;
}
function isCheckboxColumn(col) {
@ -71,6 +66,11 @@
}
function setupCheckAllCheckbox(columnId) {
if (columnId === null) {
return;
}
checkboxColumn = columns[columnId];
var firstRow = wrapper.querySelector('tr');
var th = Array.from(firstRow.querySelectorAll('th, td'))[columnId];
th.innerHTML = 'test';
@ -81,41 +81,35 @@
th.insertBefore(checkAllCheckbox, null);
window.utils.setup('checkboxRadio', checkAllCheckbox);
// attach event listener to new checkbox
checkAllCheckbox.addEventListener('input', function(event) {
lastInputWasCheckAllCheckbox = true;
toggleAll(checkAllCheckbox.checked);
});
checkAllCheckbox.addEventListener('input', onCheckAllCheckboxInput);
setupCheckboxListeners();
}
// attach event listeners to each checkbox in column
columns[columnId]
.reduce(function(acc, cell) {
acc.push(cell.querySelector(CHECKBOX_SELECTOR));
return acc;
}, [])
function onCheckAllCheckboxInput() {
toggleAll(checkAllCheckbox.checked);
}
function setupCheckboxListeners() {
checkboxColumn
.map(function(cell) {
return cell.querySelector(CHECKBOX_SELECTOR);
})
.forEach(function(checkbox) {
checkbox.addEventListener('input', function(event) {
lastInputWasCheckAllCheckbox = false;
updateCheckboxState();
});
checkbox.addEventListener('input', updateCheckAllCheckboxState);
});
}
function updateCheckboxState() {
checkAllCheckbox.checked = checkboxColumn.reduce(function(acc, cell) {
function updateCheckAllCheckboxState() {
var allChecked = checkboxColumn.reduce(function(acc, cell) {
return acc && cell.querySelector(CHECKBOX_SELECTOR).checked;
}, true);
checkAllCheckbox.checked = allChecked;
}
function toggleAll() {
// remember current state and maybe apply it later if no other checkbox got clicked inbetween
function toggleAll(checked) {
checkboxColumn.forEach(function(cell) {
cell.querySelector(CHECKBOX_SELECTOR).checked = checkAllCheckbox.checked;
cell.querySelector(CHECKBOX_SELECTOR).checked = checked;
});
if (lastInputWasCheckAllCheckbox) {
// restore previous state
}
}
init();