diff --git a/public/js/system-status.js b/public/js/system-status.js index d55adf6..d9b6c67 100644 --- a/public/js/system-status.js +++ b/public/js/system-status.js @@ -65,15 +65,37 @@ function initSystemStatus() { // Set status text updateStatusElement.innerHTML = ' Update available'; - // Show alert box + // Show alert box with extreme prejudice const alertBox = updateAvailableDiv.querySelector('.alert'); if (alertBox) { - alertBox.style.display = 'block'; - // Update message + // Add important inline styles to override any CSS + alertBox.setAttribute('style', + 'display: block !important; ' + + 'visibility: visible !important; ' + + 'opacity: 1 !important; ' + + 'margin-top: 10px !important; ' + + 'border: 3px solid red !important; ' + + 'background-color: #ffeeee !important; ' + + 'color: #990000 !important; ' + + 'font-weight: bold !important; ' + + 'box-shadow: 0 4px 8px rgba(0,0,0,0.3) !important; ' + + 'position: relative !important; ' + + 'z-index: 9999 !important;' + ); + + // Update message with important style const spanElement = alertBox.querySelector('span'); if (spanElement) { spanElement.textContent = `A new version is available: ${currentVersion} → ${remoteVersion}`; + spanElement.setAttribute('style', 'color: #990000 !important; font-weight: bold !important;'); } + + // Also ensure the parent div is visible + updateAvailableDiv.style.display = 'block'; + updateAvailableDiv.style.visibility = 'visible'; + + // Log that we've shown the update button + console.log('Update alert shown:', currentVersion, '->', remoteVersion); } // Store in localStorage @@ -95,7 +117,7 @@ function initSystemStatus() { localStorage.removeItem(REMOTE_VERSION_KEY); } - // Check localStorage on init + // Check localStorage on init and set up MutationObserver to prevent hiding (function checkStoredUpdateStatus() { const isUpdateAvailable = localStorage.getItem(UPDATE_KEY) === 'true'; if (isUpdateAvailable) { @@ -103,6 +125,38 @@ function initSystemStatus() { const remoteVersion = localStorage.getItem(REMOTE_VERSION_KEY); if (currentVersion && remoteVersion) { showUpdateAlert(currentVersion, remoteVersion); + + // Set up mutation observer to detect and revert any attempts to hide the update alert + const alertBox = updateAvailableDiv.querySelector('.alert'); + if (alertBox) { + const observer = new MutationObserver(function(mutations) { + mutations.forEach(function(mutation) { + if (mutation.type === 'attributes' && + (mutation.attributeName === 'style' || + mutation.attributeName === 'class')) { + + // If display is being changed to hide the element, force it back to visible + if (alertBox.style.display !== 'block' || + alertBox.classList.contains('d-none') || + alertBox.style.visibility === 'hidden' || + alertBox.style.opacity === '0') { + + console.log('Detected attempt to hide update button, forcing display'); + showUpdateAlert(currentVersion, remoteVersion); + } + } + }); + }); + + // Observe style and class attribute changes + observer.observe(alertBox, { + attributes: true, + attributeFilter: ['style', 'class'] + }); + + // Store observer in window object to prevent garbage collection + window._updateButtonObserver = observer; + } } } })(); @@ -342,10 +396,47 @@ function initSystemStatus() { }); } + // Persistent update button - force display every second if update is available + function forceShowUpdateButton() { + const isUpdateAvailable = localStorage.getItem(UPDATE_KEY) === 'true'; + + if (isUpdateAvailable) { + const alertBox = updateAvailableDiv.querySelector('.alert'); + if (alertBox && alertBox.style.display !== 'block') { + console.log('Forcing update button display'); + alertBox.style.display = 'block'; + alertBox.style.visibility = 'visible'; + alertBox.style.opacity = '1'; + + // Add important inline styles to override any CSS + alertBox.setAttribute('style', + 'display: block !important; ' + + 'visibility: visible !important; ' + + 'opacity: 1 !important; ' + + 'margin-top: 10px !important; ' + + 'border: 3px solid red !important; ' + + 'background-color: #ffeeee !important; ' + + 'color: #990000 !important; ' + + 'font-weight: bold !important; ' + + 'box-shadow: 0 4px 8px rgba(0,0,0,0.3) !important; ' + + 'position: relative !important; ' + + 'z-index: 9999 !important;' + ); + + // Also ensure the parent div is visible + updateAvailableDiv.style.display = 'block'; + updateAvailableDiv.style.visibility = 'visible'; + } + } + } + // Initialize loadSystemStatus(); checkForUpdates(); + // Force check the update button status every second + setInterval(forceShowUpdateButton, 1000); + // Set interval to refresh uptime every minute setInterval(loadSystemStatus, 60000); } \ No newline at end of file