Fix update button persistence with more robust implementation
- Completely redesigned update notification system with dedicated functions - Added showUpdateAlert and hideUpdateAlert functions for better control - Improved update status persistence with namespaced localStorage keys - Added custom CSS styles with \!important to prevent style overrides - Modified toggle test functionality to directly show/hide the update alert - Prevented update notifications from being cleared on errors - Added forced display styles and higher z-index for visibility - Added debugging logs to verify update detection 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
b8818a9bec
commit
5261f7b4f4
@ -137,8 +137,8 @@
|
||||
<div class="mt-2 testing-controls">
|
||||
<small><a href="#" id="toggle-test-update-button">Toggle Test Update</a></small>
|
||||
</div>
|
||||
<div id="update-available" class="mt-3 d-none">
|
||||
<div class="alert alert-info">
|
||||
<div id="update-available" class="mt-3">
|
||||
<div class="alert alert-info update-alert" style="display: none;">
|
||||
<i class="fas fa-arrow-circle-up"></i>
|
||||
<span>A new version is available!</span>
|
||||
<button id="btn-update-now" class="btn btn-sm btn-primary ml-2">
|
||||
@ -669,6 +669,26 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Update Alert Custom Styles -->
|
||||
<style>
|
||||
/* Custom styles for update alert to ensure it's visible */
|
||||
.update-alert {
|
||||
display: none;
|
||||
margin-top: 10px !important;
|
||||
border: 2px solid #007bff !important;
|
||||
background-color: #cce5ff !important;
|
||||
color: #004085 !important;
|
||||
font-weight: bold !important;
|
||||
box-shadow: 0 2px 5px rgba(0,0,0,0.2) !important;
|
||||
position: relative !important;
|
||||
z-index: 100 !important;
|
||||
}
|
||||
.update-alert span {
|
||||
color: #004085 !important;
|
||||
font-weight: bold !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- JavaScript Files -->
|
||||
<script src="/js/system-status.js"></script>
|
||||
<script src="/js/app.js"></script>
|
||||
|
||||
@ -54,31 +54,61 @@ function initSystemStatus() {
|
||||
});
|
||||
}
|
||||
|
||||
// Track update check status
|
||||
let updateAvailable = localStorage.getItem('updateAvailable') === 'true';
|
||||
// More robust update check status tracking
|
||||
const UPDATE_KEY = 'trm_update_available';
|
||||
const CURRENT_VERSION_KEY = 'trm_current_version';
|
||||
const REMOTE_VERSION_KEY = 'trm_remote_version';
|
||||
let updateCheckInProgress = false;
|
||||
|
||||
// If we have stored update info, restore it
|
||||
if (updateAvailable) {
|
||||
const currentVersion = localStorage.getItem('currentVersion');
|
||||
const remoteVersion = localStorage.getItem('remoteVersion');
|
||||
// Function to show update alert
|
||||
function showUpdateAlert(currentVersion, remoteVersion) {
|
||||
// Set status text
|
||||
updateStatusElement.innerHTML = '<i class="fas fa-exclamation-circle text-warning"></i> Update available';
|
||||
|
||||
if (currentVersion && remoteVersion) {
|
||||
updateStatusElement.innerHTML = '<i class="fas fa-exclamation-circle text-warning"></i> Update available';
|
||||
updateAvailableDiv.classList.remove('d-none');
|
||||
updateAvailableDiv.style.display = 'block'; // Force display
|
||||
updateAvailableDiv.querySelector('span').textContent =
|
||||
`A new version is available: ${currentVersion} → ${remoteVersion}`;
|
||||
// Show alert box
|
||||
const alertBox = updateAvailableDiv.querySelector('.alert');
|
||||
if (alertBox) {
|
||||
alertBox.style.display = 'block';
|
||||
// Update message
|
||||
const spanElement = alertBox.querySelector('span');
|
||||
if (spanElement) {
|
||||
spanElement.textContent = `A new version is available: ${currentVersion} → ${remoteVersion}`;
|
||||
}
|
||||
}
|
||||
|
||||
// Store in localStorage
|
||||
localStorage.setItem(UPDATE_KEY, 'true');
|
||||
localStorage.setItem(CURRENT_VERSION_KEY, currentVersion);
|
||||
localStorage.setItem(REMOTE_VERSION_KEY, remoteVersion);
|
||||
}
|
||||
|
||||
// Function to hide update alert
|
||||
function hideUpdateAlert() {
|
||||
const alertBox = updateAvailableDiv.querySelector('.alert');
|
||||
if (alertBox) {
|
||||
alertBox.style.display = 'none';
|
||||
}
|
||||
|
||||
// Clear localStorage
|
||||
localStorage.removeItem(UPDATE_KEY);
|
||||
localStorage.removeItem(CURRENT_VERSION_KEY);
|
||||
localStorage.removeItem(REMOTE_VERSION_KEY);
|
||||
}
|
||||
|
||||
// Check localStorage on init
|
||||
(function checkStoredUpdateStatus() {
|
||||
const isUpdateAvailable = localStorage.getItem(UPDATE_KEY) === 'true';
|
||||
if (isUpdateAvailable) {
|
||||
const currentVersion = localStorage.getItem(CURRENT_VERSION_KEY);
|
||||
const remoteVersion = localStorage.getItem(REMOTE_VERSION_KEY);
|
||||
if (currentVersion && remoteVersion) {
|
||||
showUpdateAlert(currentVersion, remoteVersion);
|
||||
}
|
||||
}
|
||||
})();
|
||||
|
||||
// Check for updates
|
||||
function checkForUpdates() {
|
||||
// Don't hide update button if an update is available and we're just refreshing
|
||||
if (!updateAvailable) {
|
||||
updateAvailableDiv.classList.add('d-none');
|
||||
}
|
||||
|
||||
updateStatusElement.innerHTML = '<i class="fas fa-circle-notch fa-spin"></i> Checking...';
|
||||
updateCheckInProgress = true;
|
||||
|
||||
@ -131,30 +161,21 @@ function initSystemStatus() {
|
||||
|
||||
if (data.status === 'success') {
|
||||
if (data.data && data.data.updateAvailable) {
|
||||
updateAvailable = true;
|
||||
updateStatusElement.innerHTML = '<i class="fas fa-exclamation-circle text-warning"></i> Update available';
|
||||
// Show update alert with version info
|
||||
showUpdateAlert(data.data.currentVersion, data.data.remoteVersion);
|
||||
|
||||
// Make update button visible immediately
|
||||
updateAvailableDiv.classList.remove('d-none');
|
||||
updateAvailableDiv.style.display = 'block'; // Force display
|
||||
|
||||
updateAvailableDiv.querySelector('span').textContent =
|
||||
`A new version is available: ${data.data.currentVersion} → ${data.data.remoteVersion}`;
|
||||
|
||||
// Store update info in localStorage to persist across refreshes
|
||||
localStorage.setItem('updateAvailable', 'true');
|
||||
localStorage.setItem('currentVersion', data.data.currentVersion);
|
||||
localStorage.setItem('remoteVersion', data.data.remoteVersion);
|
||||
// Log to console for debugging
|
||||
console.log('Update available detected:', data.data.currentVersion, '->', data.data.remoteVersion);
|
||||
} else {
|
||||
updateAvailable = false;
|
||||
// No update available
|
||||
updateStatusElement.innerHTML = '<i class="fas fa-check-circle text-success"></i> Up to date';
|
||||
localStorage.removeItem('updateAvailable');
|
||||
hideUpdateAlert();
|
||||
}
|
||||
} else {
|
||||
// Error status but with a response
|
||||
updateAvailable = false;
|
||||
updateStatusElement.innerHTML = '<i class="fas fa-times-circle text-danger"></i> Check failed';
|
||||
showNotification(data.message || 'Failed to check for updates', 'danger');
|
||||
// Don't clear update status on error - keep any previous update notification
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
@ -171,6 +192,8 @@ function initSystemStatus() {
|
||||
} else {
|
||||
showNotification(error.message || 'Failed to connect to server', 'danger');
|
||||
}
|
||||
|
||||
// Don't clear update status on error - keep any previous update notification
|
||||
});
|
||||
}
|
||||
|
||||
@ -305,10 +328,17 @@ function initSystemStatus() {
|
||||
localStorage.setItem('showUpdateButton', newSetting);
|
||||
testToggle.innerText = newSetting ? 'Disable Test Update' : 'Enable Test Update';
|
||||
|
||||
// Re-check for updates with new setting
|
||||
checkForUpdates();
|
||||
|
||||
showNotification(`Test update button ${newSetting ? 'enabled' : 'disabled'}`, 'info');
|
||||
if (newSetting) {
|
||||
// If enabling test mode, force show update button
|
||||
showUpdateAlert('2.0.10', '2.1.0-test');
|
||||
updateStatusElement.innerHTML = '<i class="fas fa-exclamation-circle text-warning"></i> Update available';
|
||||
showNotification('Test update button enabled', 'info');
|
||||
} else {
|
||||
// If disabling test mode, check for real updates
|
||||
hideUpdateAlert();
|
||||
checkForUpdates();
|
||||
showNotification('Test update button disabled', 'info');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user