Add system control feature for remote shutdown/restart with timer support and UI integration

wwwroot/js/dashboard.js

@@ -40,6 +40,54 @@ class ResourceDashboard {
         document.getElementById('refreshData').addEventListener('click', () => {
             this.refreshData();
         });
+
+        // System control event listeners
+        document.getElementById('systemControl').addEventListener('click', () => {
+            this.showSystemControlModal();
+        });
+
+        document.getElementById('closeSystemModal').addEventListener('click', () => {
+            this.hideSystemControlModal();
+        });
+
+        document.getElementById('shutdownBtn').addEventListener('click', () => {
+            this.executeSystemCommand('shutdown');
+        });
+
+        document.getElementById('restartBtn').addEventListener('click', () => {
+            this.executeSystemCommand('restart');
+        });
+
+        // Hidden system control activation - triple click on title
+        let clickCount = 0;
+        let clickTimer = null;
+        document.querySelector('h1').addEventListener('click', () => {
+            clickCount++;
+            if (clickCount === 1) {
+                clickTimer = setTimeout(() => {
+                    clickCount = 0;
+                }, 2000); // Reset after 2 seconds
+            } else if (clickCount === 3) {
+                clearTimeout(clickTimer);
+                clickCount = 0;
+                this.toggleSystemControlButton();
+            }
+        });
+
+        // Close modal when clicking outside
+        document.getElementById('systemControlModal').addEventListener('click', (e) => {
+            if (e.target.id === 'systemControlModal') {
+                this.hideSystemControlModal();
+            }
+        });
+
+        // Keyboard shortcut: Ctrl+Shift+P to toggle system control
+        document.addEventListener('keydown', (e) => {
+            if (e.ctrlKey && e.shiftKey && e.key === 'P') {
+                e.preventDefault();
+                this.toggleSystemControlButton();
+            }
+        });
     }
 
     toggleDetailsSection() {
@@ -675,6 +723,98 @@ class ResourceDashboard {
         }, 3000);
     }
 
+    // System Control Methods
+    toggleSystemControlButton() {
+        const systemButton = document.getElementById('systemControl');
+        if (systemButton.classList.contains('hidden')) {
+            systemButton.classList.remove('hidden');
+            this.showNotification('System control unlocked! Use with caution.', 'info');
+        } else {
+            systemButton.classList.add('hidden');
+            this.hideSystemControlModal();
+        }
+    }
+
+    showSystemControlModal() {
+        document.getElementById('systemControlModal').classList.remove('hidden');
+        document.getElementById('systemTimer').value = '';
+        document.getElementById('forceShutdown').checked = true;
+    }
+
+    hideSystemControlModal() {
+        document.getElementById('systemControlModal').classList.add('hidden');
+    }
+
+    async executeSystemCommand(action) {
+        const timer = document.getElementById('systemTimer').value;
+        const force = document.getElementById('forceShutdown').checked;
+        
+        // Validate timer input
+        const timerSeconds = parseInt(timer) || 0;
+        if (timerSeconds < 0 || timerSeconds > 86400) {
+            this.showNotification('Timer must be between 0 and 86400 seconds (24 hours)', 'error');
+            return;
+        }
+
+        // Build confirmation message
+        let confirmMessage = `Are you sure you want to ${action} the system`;
+        if (timerSeconds > 0) {
+            const minutes = Math.floor(timerSeconds / 60);
+            const seconds = timerSeconds % 60;
+            if (minutes > 0) {
+                confirmMessage += ` in ${minutes} minute${minutes !== 1 ? 's' : ''}`;
+                if (seconds > 0) {
+                    confirmMessage += ` and ${seconds} second${seconds !== 1 ? 's' : ''}`;
+                }
+            } else {
+                confirmMessage += ` in ${seconds} second${seconds !== 1 ? 's' : ''}`;
+            }
+        } else {
+            confirmMessage += ' immediately';
+        }
+        confirmMessage += '?';
+
+        if (!confirm(confirmMessage)) {
+            return;
+        }
+
+        try {
+            // Prepare the command data
+            const commandData = {
+                action: action,
+                timer: timerSeconds,
+                force: force
+            };
+
+            const response = await fetch('/api/resource/system-control', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                body: JSON.stringify(commandData)
+            });
+
+            if (response.ok) {
+                const result = await response.json();
+                this.showNotification(result.message, 'success');
+                this.hideSystemControlModal();
+                
+                // If immediate action, warn user
+                if (timerSeconds === 0) {
+                    setTimeout(() => {
+                        this.showNotification(`System ${action} initiated! Connection will be lost.`, 'info');
+                    }, 1000);
+                }
+            } else {
+                const error = await response.text();
+                this.showNotification(`Failed to ${action} system: ${error}`, 'error');
+            }
+        } catch (error) {
+            console.error(`Error executing ${action}:`, error);
+            this.showNotification(`Error executing ${action} command`, 'error');
+        }
+    }
+
     hideLoading() {
         document.getElementById('loadingOverlay').style.display = 'none';
     }