Skip to content

Commit 7af6c05

Browse files
authored
Merge pull request #37 from netgen/NGSTACK-922-remove-jquery
NGSTACK-922 remove jquery
2 parents 4b27ac2 + 2f81e8c commit 7af6c05

File tree

2 files changed

+240
-157
lines changed

2 files changed

+240
-157
lines changed
Lines changed: 46 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,54 @@
1-
(function($) {
2-
'use strict';
3-
$('.multientry').multientry();
1+
const init = () => {
2+
window.initaliseMultientries();
43

5-
const saveButton = document.getElementById('content_type_edit__sidebar_right__save-tab');
4+
const observer = new MutationObserver(() => {
5+
window.initaliseMultientries();
6+
});
67

7-
const observer = new MutationObserver(e => {
8-
$('.multientry').multientry();
8+
// enables observer when element is dropped
9+
document.addEventListener('drop', () => {
10+
document.querySelectorAll('.ibexa-collapse').forEach((element) => {
11+
observer.observe(element, { childList: true, subtree: true });
912
});
13+
});
1014

11-
// enables observer when elements is dropped
12-
document.addEventListener("drop", e => {
13-
document.querySelectorAll('.ibexa-collapse').forEach(el => {
14-
observer.observe(el, { childList: true, subtree: true });
15-
});
15+
// disable observer while dragging to reduce function firing
16+
document.addEventListener('drag', () => {
17+
document.querySelectorAll('.ibexa-collapse').forEach(() => {
18+
observer.disconnect();
1619
});
20+
});
1721

18-
// disable observer while dragging to reduce function firing
19-
document.addEventListener("drag", e => {
20-
document.querySelectorAll('.ibexa-collapse').forEach(el => {
21-
observer.disconnect();
22-
});
23-
});
22+
// checks if any multientry inputs are empty and expands the field type
23+
const saveButton = document.getElementById('content_type_edit__sidebar_right__save-tab');
24+
25+
saveButton && saveButton.addEventListener('click', (event) => {
26+
document.querySelectorAll('.multientry input').forEach((input) => {
27+
if (input.value.length > 0) {
28+
return;
29+
}
30+
31+
event.preventDefault();
32+
33+
const collapseWrapper = input.closest('.ibexa-collapse');
34+
const collapseBody = collapseWrapper.querySelector('.ibexa-collapse__body');
35+
const collapseToggle = collapseWrapper.querySelector('.ibexa-collapse__toggle-btn');
2436

25-
// checks if any multientry inputs are empty and expands the field type
26-
saveButton && saveButton.addEventListener("click", e => {
27-
document.querySelectorAll('.multientry input').forEach(el => {
28-
if (el.value.length === 0) {
29-
e.preventDefault();
30-
const fullElement = el.closest('.ibexa-collapse');
31-
const elementBody = fullElement.querySelector('.ibexa-collapse__body');
32-
const collapseToggle = fullElement.querySelector('.ibexa-collapse__toggle-btn');
33-
fullElement.classList.contains('multientry-error') ? null : fullElement.classList.add('multientry-error');
34-
fullElement.classList.contains('ibexa-collapse--collapsed') ? fullElement.classList.remove('ibexa-collapse--collapsed') : null;
35-
elementBody.classList.contains('show') ? null : elementBody.classList.add('show');
36-
collapseToggle.classList.contains('collapsed') ? elementBody.classList.remove('collapsed') : null;
37-
fullElement.dataset.collapsed ? fullElement.dataset.collapsed = false : null;
38-
}
39-
})
37+
collapseWrapper.classList.add('multientry-error');
38+
collapseWrapper.classList.remove('ibexa-collapse--collapsed');
39+
collapseWrapper.dataset.collapsed = false;
40+
41+
collapseBody.classList.add('show');
42+
43+
if (collapseToggle.classList.contains('collapsed')) {
44+
collapseBody.classList.remove('collapsed');
45+
}
4046
});
41-
})(jQuery);
47+
});
48+
};
49+
50+
if (document.readyState === 'loading') {
51+
document.addEventListener('DOMContentLoaded', init);
52+
} else {
53+
init();
54+
}

0 commit comments

Comments
 (0)