2025-05-24 15:47:40 +02:00

77 lines
2.8 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SeReact Debug</title>
<style>
body { font-family: Arial, sans-serif; margin: 20px; }
button { margin: 5px; padding: 10px; }
.page { display: none; padding: 20px; border: 1px solid #ccc; margin: 10px; }
.debug { background: #f0f0f0; padding: 10px; margin: 10px; }
</style>
</head>
<body>
<h1>SeReact Debug Page</h1>
<div class="debug">
<h3>Debug Controls</h3>
<button onclick="testConfigPage()">Test Config Page</button>
<button onclick="testPageNavigation()">Test Navigation</button>
<button onclick="showPage('config')">Show Config</button>
<button onclick="console.log('Config object:', config)">Log Config</button>
</div>
<div id="configPage" class="page">
<h2>Configuration</h2>
<form id="configForm">
<div>
<label for="apiBaseUrl">API Base URL:</label><br>
<input type="url" id="apiBaseUrl" placeholder="http://localhost:8000" style="width: 300px;">
</div>
<br>
<div>
<label for="apiKey">API Key:</label><br>
<input type="password" id="apiKey" placeholder="Enter your API key" style="width: 300px;">
</div>
<br>
<button type="submit">Save Configuration</button>
<button type="button" onclick="testConnection()">Test Connection</button>
</form>
</div>
<div id="alertContainer"></div>
<script>
// Mock functions for testing
function showAlert(message, type) {
const alertDiv = document.createElement('div');
alertDiv.style.padding = '10px';
alertDiv.style.margin = '10px';
alertDiv.style.border = '1px solid';
alertDiv.style.backgroundColor = type === 'success' ? '#d4edda' : type === 'danger' ? '#f8d7da' : '#fff3cd';
alertDiv.textContent = `${type.toUpperCase()}: ${message}`;
document.getElementById('alertContainer').appendChild(alertDiv);
setTimeout(() => alertDiv.remove(), 5000);
}
function updateNavigationState() {
console.log('updateNavigationState called');
}
</script>
<script src="js/config.js"></script>
<script src="js/ui.js"></script>
<script>
// Initialize after scripts load
document.addEventListener('DOMContentLoaded', () => {
console.log('Debug page loaded');
console.log('Config object:', config);
// Test showing config page
showPage('config');
});
</script>
</body>
</html>