100 lines
3.2 KiB
JavaScript
100 lines
3.2 KiB
JavaScript
(() => {
|
|
function applyTypeFilter(typeSelect, portSelect, selectedId) {
|
|
const endpointType = typeSelect.value;
|
|
let visibleCount = 0;
|
|
let matchedSelected = false;
|
|
const currentValue = selectedId || portSelect.value || '';
|
|
|
|
for (const option of portSelect.options) {
|
|
const optionType = option.dataset.endpointType || '';
|
|
if (!optionType) {
|
|
option.hidden = false;
|
|
option.disabled = false;
|
|
continue;
|
|
}
|
|
|
|
const visible = optionType === endpointType;
|
|
option.hidden = !visible;
|
|
option.disabled = !visible;
|
|
|
|
if (visible) {
|
|
visibleCount += 1;
|
|
if (option.value === currentValue) {
|
|
option.selected = true;
|
|
matchedSelected = true;
|
|
}
|
|
} else if (option.selected) {
|
|
option.selected = false;
|
|
}
|
|
}
|
|
|
|
const placeholder = portSelect.options[0];
|
|
if (placeholder) {
|
|
placeholder.textContent = visibleCount > 0 ? '- Port waehlen -' : '- Keine Ports verfuegbar -';
|
|
}
|
|
|
|
if (!matchedSelected) {
|
|
portSelect.value = '';
|
|
}
|
|
}
|
|
|
|
function bindPair(typeSelectId, portSelectId) {
|
|
const typeSelect = document.getElementById(typeSelectId);
|
|
const portSelect = document.getElementById(portSelectId);
|
|
if (!typeSelect || !portSelect) {
|
|
return;
|
|
}
|
|
|
|
applyTypeFilter(typeSelect, portSelect, portSelect.dataset.selectedId || '');
|
|
typeSelect.addEventListener('change', () => {
|
|
applyTypeFilter(typeSelect, portSelect, '');
|
|
});
|
|
}
|
|
|
|
function enforceTopologyTypeRules(typeA, typeB) {
|
|
const allowWithPatchpanel = { patchpanel: true, outlet: true };
|
|
const selectedA = typeA.value;
|
|
const selectedB = typeB.value;
|
|
|
|
const applyRules = (sourceType, targetSelect) => {
|
|
for (const option of targetSelect.options) {
|
|
const value = option.value;
|
|
if (!value) {
|
|
option.disabled = false;
|
|
continue;
|
|
}
|
|
if (sourceType === 'patchpanel') {
|
|
option.disabled = !allowWithPatchpanel[value];
|
|
} else {
|
|
option.disabled = false;
|
|
}
|
|
}
|
|
if (targetSelect.selectedOptions.length > 0 && targetSelect.selectedOptions[0].disabled) {
|
|
targetSelect.value = '';
|
|
}
|
|
};
|
|
|
|
applyRules(selectedA, typeB);
|
|
applyRules(selectedB, typeA);
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
bindPair('port_a_type', 'port_a_id');
|
|
bindPair('port_b_type', 'port_b_id');
|
|
|
|
const typeA = document.getElementById('port_a_type');
|
|
const typeB = document.getElementById('port_b_type');
|
|
if (!typeA || !typeB) {
|
|
return;
|
|
}
|
|
|
|
const syncRules = () => {
|
|
enforceTopologyTypeRules(typeA, typeB);
|
|
};
|
|
|
|
syncRules();
|
|
typeA.addEventListener('change', syncRules);
|
|
typeB.addEventListener('change', syncRules);
|
|
});
|
|
})();
|