ske087/digiserver
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updated app start

Browse Source
This commit is contained in:
Scheianu Ionut
2025-08-05 16:50:46 +03:00
parent 318f783de3
commit 2e719fc029
37 changed files with 1028 additions and 198 deletions
Download Patch File Download Diff File Expand all files Collapse all files

163
templates/admin.html
View File

@@ -210,6 +210,59 @@
</div>
</div>
<!-- Performance Monitoring Dashboard -->
<div class="card mb-4 {{ 'dark-mode' if theme == 'dark' else '' }}">
<div class="card-header bg-success text-white">
<h2>Performance Monitor</h2>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-4">
<div class="text-center">
<h5>CPU Usage</h5>
<div id="cpu-gauge" class="progress mb-2">
<div class="progress-bar bg-info" role="progressbar" style="width: 0%"></div>
</div>
<small id="cpu-text">0%</small>
</div>
</div>
<div class="col-md-4">
<div class="text-center">
<h5>Memory Usage</h5>
<div id="memory-gauge" class="progress mb-2">
<div class="progress-bar bg-warning" role="progressbar" style="width: 0%"></div>
</div>
<small id="memory-text">0%</small>
</div>
</div>
<div class="col-md-4">
<div class="text-center">
<h5>Disk Usage</h5>
<div id="disk-gauge" class="progress mb-2">
<div class="progress-bar bg-danger" role="progressbar" style="width: 0%"></div>
</div>
<small id="disk-text">0%</small>
</div>
</div>
</div>
<div class="row mt-3">
<div class="col-12">
<button id="toggle-monitor" class="btn btn-primary">Start Monitoring</button>
<button id="reset-stats" class="btn btn-secondary">Reset Stats</button>
<span id="monitor-status" class="ms-3 text-muted">Monitoring stopped</span>
</div>
</div>
<div class="row mt-3">
<div class="col-12">
<h6>Performance Log:</h6>
<div id="perf-log" style="height: 100px; overflow-y: scroll; background-color: #f8f9fa; padding: 10px; border-radius: 5px; font-family: monospace; font-size: 12px;">
<div class="text-muted">Performance monitoring ready...</div>
</div>
</div>
</div>
</div>
</div>
<div class="mt-4">
<a href="{{ url_for('dashboard') }}" class="btn btn-secondary">Back to Dashboard</a>
</div>
@@ -227,6 +280,116 @@
popup.style.display = 'none';
}, 5000);
}
// Performance monitoring functionality
let monitoringInterval = null;
let isMonitoring = false;
let maxCpu = 0, maxMemory = 0;
function updateGauge(elementId, textId, value, color) {
const gauge = document.querySelector(`#${elementId} .progress-bar`);
const text = document.getElementById(textId);
gauge.style.width = `${value}%`;
gauge.className = `progress-bar ${color}`;
text.textContent = `${value.toFixed(1)}%`;
}
function logPerformance(message) {
const log = document.getElementById('perf-log');
const timestamp = new Date().toLocaleTimeString();
const logEntry = document.createElement('div');
logEntry.innerHTML = `<span class="text-muted">[${timestamp}]</span> ${message}`;
log.appendChild(logEntry);
log.scrollTop = log.scrollHeight;
// Keep only last 50 entries
if (log.children.length > 50) {
log.removeChild(log.firstChild);
}
}
function updatePerformanceStats() {
fetch('/api/performance')
.then(response => response.json())
.then(data => {
if (data.error) {
logPerformance(`Error: ${data.error}`);
return;
}
// Update gauges
updateGauge('cpu-gauge', 'cpu-text', data.cpu_percent, 'bg-info');
updateGauge('memory-gauge', 'memory-text', data.memory_percent, 'bg-warning');
updateGauge('disk-gauge', 'disk-text', data.disk_percent, 'bg-danger');
// Track maximum values
if (data.cpu_percent > maxCpu) {
maxCpu = data.cpu_percent;
logPerformance(`New CPU peak: ${maxCpu.toFixed(1)}%`);
}
if (data.memory_percent > maxMemory) {
maxMemory = data.memory_percent;
logPerformance(`New Memory peak: ${maxMemory.toFixed(1)}%`);
}
// Log significant changes
if (data.cpu_percent > 80) {
logPerformance(`<span class="text-danger">High CPU usage: ${data.cpu_percent.toFixed(1)}%</span>`);
}
if (data.memory_percent > 80) {
logPerformance(`<span class="text-danger">High Memory usage: ${data.memory_percent.toFixed(1)}%</span>`);
}
})
.catch(error => {
logPerformance(`Fetch error: ${error.message}`);
});
}
function toggleMonitoring() {
const toggleButton = document.getElementById('toggle-monitor');
const statusSpan = document.getElementById('monitor-status');
if (isMonitoring) {
// Stop monitoring
clearInterval(monitoringInterval);
isMonitoring = false;
toggleButton.textContent = 'Start Monitoring';
toggleButton.className = 'btn btn-primary';
statusSpan.textContent = 'Monitoring stopped';
statusSpan.className = 'ms-3 text-muted';
logPerformance('Monitoring stopped');
} else {
// Start monitoring
isMonitoring = true;
toggleButton.textContent = 'Stop Monitoring';
toggleButton.className = 'btn btn-danger';
statusSpan.textContent = 'Monitoring active';
statusSpan.className = 'ms-3 text-success';
logPerformance('Monitoring started');
// Update immediately and then every 2 seconds
updatePerformanceStats();
monitoringInterval = setInterval(updatePerformanceStats, 2000);
}
}
function resetStats() {
maxCpu = 0;
maxMemory = 0;
const log = document.getElementById('perf-log');
log.innerHTML = '<div class="text-muted">Performance log reset...</div>';
logPerformance('Stats reset');
}
// Event listeners
document.getElementById('toggle-monitor').addEventListener('click', toggleMonitoring);
document.getElementById('reset-stats').addEventListener('click', resetStats);
// Auto-start monitoring when page loads
document.addEventListener('DOMContentLoaded', function() {
// Initial stats load
updatePerformanceStats();
});
</script>
</body>
</html>