Untitled
unknown
plain_text
a year ago
3.2 kB
17
Indexable
initBlock(block) {
const select = block.querySelector('.performance-data__select');
const dropdownHeader = block.querySelector('.dropdown-header');
const dropdownButton = block.querySelector('.dropdown-button');
const dropdownOptions = Array.from(block.querySelectorAll('.dropdown-option'));
const windowhashdata = window.location.hash ? window.location.hash : '';
// Handling the select dropdown
if (select) {
const options = Array.from(select.querySelectorAll('option'));
select.addEventListener('change', (e) => this.selectTab(e, block));
document.addEventListener('setGatingState', () => {
this.selectedState = getSelectedStateFromLocalStorage();
this.updateTabs(select, options, windowhashdata);
});
this.updateTabs(select, options);
this.selectTabOnload(block, windowhashdata);
block.dataset.initiallyHidden = false;
if (block.querySelector('.is-sticky')) {
this.positionSelectDropdown(block);
}
}
// Handling the custom dropdown with buttons and options
else {
if (dropdownHeader) {
dropdownHeader.addEventListener('click', (e) => this.toggleDropdown(e, block));
}
if (dropdownButton) {
dropdownButton.addEventListener('click', (e) => this.toggleDropdown(e, block));
}
if (dropdownOptions.length > 0) {
dropdownOptions.forEach(option => {
option.addEventListener('click', (e) => this.selectDropdownOption(e, block));
});
}
document.addEventListener('click', (event) => {
if (!event.target.closest('.dropdown-container')) {
this.closeDropdown(block);
}
});
document.addEventListener('setGatingState', () => {
this.selectedState = getSelectedStateFromLocalStorage();
this.updateTabsForDropdown(dropdownOptions, windowhashdata, block);
});
block.dataset.initiallyHidden = false;
this.updateTabsForDropdown(dropdownOptions, windowhashdata, block);
this.selectTabOnloadForDropdown(block, windowhashdata);
window.addEventListener('scroll', () => this.handleScroll(block));
}
// Set the initial value of the dropdown button based on priority: hash value, gating state, or default option
const hashValue = windowhashdata ? windowhashdata.replace('#', '').toLowerCase() : null;
let selectedOption = null;
if (hashValue) {
selectedOption = dropdownOptions.find(option => option.getAttribute('value') === hashValue);
}
if (!selectedOption && this.selectedState) {
selectedOption = dropdownOptions.find(option => {
const defaultInStates = option.dataset.defaultInStates?.split(' ');
return defaultInStates && defaultInStates.includes(this.selectedState);
});
}
if (!selectedOption) {
selectedOption = dropdownOptions[0];
}
if (selectedOption && dropdownButton) {
dropdownButton.innerText = selectedOption.innerText;
this.selectDropdownOption({ target: selectedOption, stopPropagation: () => {} }, block);
}
}
Editor is loading...
Leave a Comment