64 lines
2.0 KiB
JavaScript
64 lines
2.0 KiB
JavaScript
class SimpleOpacityController {
|
|
constructor(controlSelector, targetSelector) {
|
|
this.controlSelector = controlSelector;
|
|
this.targetSelector = targetSelector;
|
|
this.disabledClass = 'disabled-state';
|
|
|
|
this.init();
|
|
}
|
|
|
|
init() {
|
|
const controls = document.querySelectorAll(this.controlSelector);
|
|
const targets = document.querySelectorAll(this.targetSelector);
|
|
|
|
// Listener para detectar mudanças
|
|
controls.forEach(control => {
|
|
control.addEventListener('change', () => {
|
|
this.updateOpacity();
|
|
});
|
|
});
|
|
|
|
// Estado inicial
|
|
this.updateOpacity();
|
|
|
|
// Simple opacity system initialized
|
|
}
|
|
|
|
updateOpacity() {
|
|
const hasSelection = this.hasSelection();
|
|
const targets = document.querySelectorAll(this.targetSelector);
|
|
|
|
targets.forEach(target => {
|
|
if (hasSelection) {
|
|
// TEM seleção = div normal
|
|
target.classList.remove(this.disabledClass);
|
|
// Div activated - selection detected
|
|
} else {
|
|
// NÃO tem seleção = div opaca
|
|
target.classList.add(this.disabledClass);
|
|
// Div deactivated - no selection
|
|
}
|
|
});
|
|
}
|
|
|
|
hasSelection() {
|
|
// Para SELECT: verificar se valor não está vazio
|
|
const selects = document.querySelectorAll(this.controlSelector + '[type=""], ' + this.controlSelector + ':not([type])');
|
|
for (let select of selects) {
|
|
if (select.value && select.value.trim() !== '') {
|
|
return true;
|
|
}
|
|
}
|
|
|
|
// Para RADIO BUTTONS: verificar se algum está selecionado E não é vazio
|
|
const radios = document.querySelectorAll(this.controlSelector + '[type="radio"]');
|
|
for (let radio of radios) {
|
|
if (radio.checked && radio.value && radio.value.trim() !== '') {
|
|
return true;
|
|
}
|
|
}
|
|
|
|
return false;
|
|
}
|
|
}
|