-
Notifications
You must be signed in to change notification settings - Fork 0
/
widget-list.js
65 lines (53 loc) · 1.86 KB
/
widget-list.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
(function() {
if (window.eeposStaffListWidgetScriptInitialized) return;
window.eeposStaffListWidgetScriptInitialized = true;
console.log('init!');
/**
* Finds the closest element matching the given class in the given element and its parents
* @param {Element} elem
* @param {string} theClass
* @returns {Element|undefined}
*/
function findClosestElem(elem, theClass) {
if (!elem) return;
var cursor = elem;
do {
if (cursor.classList && cursor.classList.contains(theClass)) break;
} while (cursor = cursor.parentNode);
return cursor;
}
function applyFilters(widgetRoot) {
const filters = widgetRoot.querySelectorAll('.staff-member-filter-select');
const staffMembers = widgetRoot.querySelectorAll('.staff-member');
const filterValues = {};
filters.forEach(function(filterSelect) {
if (filterSelect.value !== '') {
filterValues[filterSelect.getAttribute('data-field')] = filterSelect.value.toLowerCase();
}
});
staffMembers.forEach(function(staffMemberElem) {
let visible = true;
for (const filter in filterValues) {
const filterValue = filterValues[filter];
const staffFieldValue = staffMemberElem.getAttribute('data-field-' + filter);
visible = visible && (staffFieldValue.indexOf(filterValue) !== -1);
}
if (!visible) {
staffMemberElem.classList.add('hidden');
} else {
staffMemberElem.classList.remove('hidden');
}
});
console.log('filter applied!');
}
// Apply filters when the filter selects change
document.addEventListener('change', function(ev) {
console.log('sup', ev);
if (! ev.target.classList.contains('staff-member-filter-select')) return;
const widgetRoot = findClosestElem(ev.target, 'staff-member-list-widget');
applyFilters(widgetRoot);
});
// Initial filters
const widgets = document.querySelectorAll('staff-member-list-widget');
widgets.forEach(applyFilters);
})();