added top scrollbar imported

This commit is contained in:
Claudio 2026-05-13 14:22:43 +02:00
parent f97b52f158
commit b431f1d4e9

View File

@ -1410,6 +1410,9 @@ $gridMeta = [
const topScrollbar = document.getElementById('topScrollbar');
const topScrollbarInner = document.getElementById('topScrollbarInner');
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;
@ -1417,14 +1420,22 @@ $gridMeta = [
let syncingFromGrid = false;
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
if (gridContainer.scrollWidth > gridContainer.clientWidth) {
topScrollbarInner.style.width = realWidth + 'px';
if (realWidth > gridContainer.clientWidth) {
topScrollbar.style.display = 'block';
} else {
topScrollbar.style.display = 'none';
}
topScrollbar.scrollLeft = gridContainer.scrollLeft;
}
topScrollbar.addEventListener('scroll', function() {
@ -1441,14 +1452,24 @@ $gridMeta = [
syncingFromGrid = false;
});
updateTopScrollbarWidth();
window.addEventListener('resize', updateTopScrollbarWidth);
// Ritarda un attimo per sicurezza, visto che la griglia viene renderizzata via JS
setTimeout(updateTopScrollbarWidth, 200);
setTimeout(updateTopScrollbarWidth, 600);
setTimeout(updateTopScrollbarWidth, 1200);
// Recalculate after JS grid rendering
setTimeout(updateTopScrollbarWidth, 100);
setTimeout(updateTopScrollbarWidth, 300);
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>