Files
Virtual-Box/projects/Plastico/PHASE7_TAB_SWITCH_ADDITION.js
2025-12-02 16:27:21 +00:00

57 lines
1.8 KiB
JavaScript

// PHASE 7: Tab Switch State Refresh
// Add this code to the Home Template <script> section
// Track if this is the Home tab and listen for visibility changes
(function initTabSwitchRefresh() {
let lastVisible = true; // Start as visible since Home is default tab
// Check visibility periodically
const checkVisibility = function() {
const homeTab = document.querySelector('[aria-label="Home"]');
const isVisible = homeTab && homeTab.classList.contains('md-active');
// If tab just became visible (switched to Home)
if (isVisible && !lastVisible) {
console.log('[PHASE 7] Home tab activated - refreshing state');
// Request current state from backend
scope.send({ action: 'get-current-state' });
// Optionally: Trigger dashboard re-render
if (scope.renderDashboard) {
scope.$evalAsync(scope.renderDashboard);
}
}
lastVisible = isVisible;
};
// Check every 500ms for tab changes
setInterval(checkVisibility, 500);
// Also listen for Angular's tab change events if available
scope.$on('$locationChangeSuccess', function() {
console.log('[PHASE 7] Location change detected');
setTimeout(checkVisibility, 100);
});
})();
// ALTERNATIVE APPROACH: Listen for ui-control messages
// This approach hooks into Node-RED Dashboard's ui_control node
scope.$watch('msg', function(msg) {
if (!msg) return;
// If this is a ui_control message indicating Home tab activation
if (msg.ui_control && msg.ui_control.tab === 'Home') {
console.log('[PHASE 7] Home tab activated via ui_control');
// Refresh current state from backend
scope.send({ action: 'get-current-state' });
// Re-render dashboard
if (scope.renderDashboard) {
scope.$evalAsync(scope.renderDashboard);
}
}
});