99 lines
4.0 KiB
JavaScript
99 lines
4.0 KiB
JavaScript
// Main SPORE UI Application
|
|
|
|
// Initialize the application when DOM is loaded
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
console.log('=== SPORE UI Application Initialization ===');
|
|
|
|
// Initialize the framework (but don't navigate yet)
|
|
console.log('App: Creating framework instance...');
|
|
const app = window.app;
|
|
|
|
// Create view models
|
|
console.log('App: Creating view models...');
|
|
const clusterViewModel = new ClusterViewModel();
|
|
const firmwareViewModel = new FirmwareViewModel();
|
|
console.log('App: View models created:', { clusterViewModel, firmwareViewModel });
|
|
|
|
// Connect firmware view model to cluster data
|
|
clusterViewModel.subscribe('members', (members) => {
|
|
console.log('App: Members subscription triggered:', members);
|
|
if (members && members.length > 0) {
|
|
// Extract node information for firmware view
|
|
const nodes = members.map(member => ({
|
|
ip: member.ip,
|
|
hostname: member.hostname || member.ip
|
|
}));
|
|
firmwareViewModel.updateAvailableNodes(nodes);
|
|
console.log('App: Updated firmware view model with nodes:', nodes);
|
|
} else {
|
|
firmwareViewModel.updateAvailableNodes([]);
|
|
console.log('App: Cleared firmware view model nodes');
|
|
}
|
|
});
|
|
|
|
// Register routes with their view models
|
|
console.log('App: Registering routes...');
|
|
app.registerRoute('cluster', ClusterViewComponent, 'cluster-view', clusterViewModel);
|
|
app.registerRoute('firmware', FirmwareViewComponent, 'firmware-view', firmwareViewModel);
|
|
console.log('App: Routes registered and components pre-initialized');
|
|
|
|
// Set up navigation event listeners
|
|
console.log('App: Setting up navigation...');
|
|
app.setupNavigation();
|
|
|
|
// Set up periodic updates for cluster view with state preservation
|
|
// setupPeriodicUpdates(); // Disabled automatic refresh
|
|
|
|
// Now navigate to the default route
|
|
console.log('App: Navigating to default route...');
|
|
app.navigateTo('cluster');
|
|
|
|
console.log('=== SPORE UI Application initialization completed ===');
|
|
});
|
|
|
|
// Set up periodic updates with state preservation
|
|
function setupPeriodicUpdates() {
|
|
// Auto-refresh cluster members every 30 seconds using smart update
|
|
setInterval(() => {
|
|
if (window.app.currentView && window.app.currentView.viewModel) {
|
|
const viewModel = window.app.currentView.viewModel;
|
|
|
|
// Use smart update if available, otherwise fall back to regular update
|
|
if (viewModel.smartUpdate && typeof viewModel.smartUpdate === 'function') {
|
|
console.log('App: Performing smart update to preserve UI state...');
|
|
viewModel.smartUpdate();
|
|
} else if (viewModel.updateClusterMembers && typeof viewModel.updateClusterMembers === 'function') {
|
|
console.log('App: Performing regular update...');
|
|
viewModel.updateClusterMembers();
|
|
}
|
|
}
|
|
}, 30000);
|
|
|
|
// Update primary node display every 10 seconds (this is lightweight and doesn't affect UI state)
|
|
setInterval(() => {
|
|
if (window.app.currentView && window.app.currentView.viewModel) {
|
|
const viewModel = window.app.currentView.viewModel;
|
|
if (viewModel.updatePrimaryNodeDisplay && typeof viewModel.updatePrimaryNodeDisplay === 'function') {
|
|
viewModel.updatePrimaryNodeDisplay();
|
|
}
|
|
}
|
|
}, 10000);
|
|
}
|
|
|
|
// Global error handler
|
|
window.addEventListener('error', function(event) {
|
|
console.error('Global error:', event.error);
|
|
});
|
|
|
|
// Global unhandled promise rejection handler
|
|
window.addEventListener('unhandledrejection', function(event) {
|
|
console.error('Unhandled promise rejection:', event.reason);
|
|
});
|
|
|
|
// Clean up on page unload
|
|
window.addEventListener('beforeunload', function() {
|
|
if (window.app) {
|
|
console.log('App: Cleaning up cached components...');
|
|
window.app.cleanup();
|
|
}
|
|
});
|