added top scrollbar imported

This commit is contained in:
2026-05-13 14:22:43 +02:00
parent f97b52f158
commit b431f1d4e9
+30 -9
View File
@@ -1410,6 +1410,9 @@ $gridMeta = [
const topScrollbar = document.getElementById('topScrollbar'); const topScrollbar = document.getElementById('topScrollbar');
const topScrollbarInner = document.getElementById('topScrollbarInner'); const topScrollbarInner = document.getElementById('topScrollbarInner');
const gridContainer = document.getElementById('gridContainer'); const gridContainer = document.getElementById('gridContainer');
const gridRowContainer = document.getElementById('gridRowContainer');
const gridHeaderContainer = document.getElementById('gridHeaderContainer');
const gridTopContainer = document.getElementById('gridTopContainer');
if (!topScrollbar || !topScrollbarInner || !gridContainer) return; if (!topScrollbar || !topScrollbarInner || !gridContainer) return;
@@ -1417,14 +1420,22 @@ $gridMeta = [
let syncingFromGrid = false; let syncingFromGrid = false;
function updateTopScrollbarWidth() { function updateTopScrollbarWidth() {
topScrollbarInner.style.width = gridContainer.scrollWidth + 'px'; const realWidth = Math.max(
gridContainer.scrollWidth,
gridHeaderContainer ? gridHeaderContainer.scrollWidth : 0,
gridTopContainer ? gridTopContainer.scrollWidth : 0,
gridRowContainer ? gridRowContainer.scrollWidth : 0
);
// Mostra la barra solo se serve davvero topScrollbarInner.style.width = realWidth + 'px';
if (gridContainer.scrollWidth > gridContainer.clientWidth) {
if (realWidth > gridContainer.clientWidth) {
topScrollbar.style.display = 'block'; topScrollbar.style.display = 'block';
} else { } else {
topScrollbar.style.display = 'none'; topScrollbar.style.display = 'none';
} }
topScrollbar.scrollLeft = gridContainer.scrollLeft;
} }
topScrollbar.addEventListener('scroll', function() { topScrollbar.addEventListener('scroll', function() {
@@ -1441,14 +1452,24 @@ $gridMeta = [
syncingFromGrid = false; syncingFromGrid = false;
}); });
updateTopScrollbarWidth();
window.addEventListener('resize', updateTopScrollbarWidth); window.addEventListener('resize', updateTopScrollbarWidth);
// Ritarda un attimo per sicurezza, visto che la griglia viene renderizzata via JS // Recalculate after JS grid rendering
setTimeout(updateTopScrollbarWidth, 200); setTimeout(updateTopScrollbarWidth, 100);
setTimeout(updateTopScrollbarWidth, 600); setTimeout(updateTopScrollbarWidth, 300);
setTimeout(updateTopScrollbarWidth, 1200); setTimeout(updateTopScrollbarWidth, 700);
setTimeout(updateTopScrollbarWidth, 1500);
// Recalculate automatically when rows/header/top controls are rendered or changed
const observer = new MutationObserver(updateTopScrollbarWidth);
if (gridContainer) {
observer.observe(gridContainer, {
childList: true,
subtree: true,
attributes: true
});
}
}); });
</script> </script>