const tagOffers = (function () {
let toggleExpand = '';
let toggle = '';
let enabled = false;
return {
init: function() {
this.start();
},
start: function() {
const fields = document.querySelectorAll('.field-tag-offers');
if (fields.length) {
// if (window.screen.width > 768) {
fields.forEach(field => {
enabled = true;
let values = field.querySelector('.values');
if (values.getBoundingClientRect().height > field.getBoundingClientRect().height - parseInt(getComputedStyle(field).paddingTop) - parseInt(getComputedStyle(field).paddingBottom)) {
// if (values.getBoundingClientRect().height + parseInt(getComputedStyle(values).marginBottom) > field.getBoundingClientRect().height) {
this.createToggleExpand();
this.createToggle();
this.insertToggleExpand(values);
toggleExpand.querySelector('a').addEventListener('click', e => {
e.preventDefault();
this.insertToggle(values);
field.classList.remove('is_collapsed');
toggleExpand.remove();
});
toggle.querySelector('a').addEventListener('click', e => {
e.preventDefault();
this.insertToggleExpand(values);
field.classList.add('is_collapsed');
toggle.remove();
});
}
});
// }
this.resize();
}
},
createToggleExpand: function () {
toggleExpand = createElement("div", ['value', 'value-toggle', 'value-toggle_expand']);
toggleExpand.append(createElement("a", [], {
href: '#',
textContent: 'Еще подборки',
}));
},
createToggle: function () {
toggle = createElement("div", ['value', 'value-toggle', 'value-toggle_collapse']);
toggle.append(createElement("a", [], {
href: '#',
textContent: 'Свернуть',
}));
},
insertToggleExpand: function (values) {
values.prepend(toggleExpand);
},
insertToggle: function (values) {
values.append(toggle);
},
resize: function () {
window.addEventListener('resize', e => {
// if (window.screen.width > 768) {
// !enabled && this.start();
// } else {
// if (enabled) {
// enabled = false;
// toggleExpand ? toggleExpand.remove() : null;
// toggle ? toggle.remove() : null;
// }
// }
});
},
}
})();
tagOffers.init();