77 lines
2.8 KiB
HTML
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>Contoso 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>Contoso 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> |