104 lines
3.9 KiB
HTML
104 lines
3.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Simple Framework Test</title>
|
|
<style>
|
|
body { font-family: Arial, sans-serif; margin: 20px; }
|
|
.test-section { margin: 20px 0; padding: 20px; border: 1px solid #ccc; }
|
|
.success { color: green; }
|
|
.error { color: red; }
|
|
button { margin: 5px; padding: 10px; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>Simple Framework Test</h1>
|
|
|
|
<div class="test-section">
|
|
<h2>API Test</h2>
|
|
<button onclick="testAPI()">Test API Connection</button>
|
|
<div id="api-result"></div>
|
|
</div>
|
|
|
|
<div class="test-section">
|
|
<h2>Framework Test</h2>
|
|
<button onclick="testFramework()">Test Framework</button>
|
|
<div id="framework-result"></div>
|
|
</div>
|
|
|
|
<script src="framework.js"></script>
|
|
<script src="api-client.js"></script>
|
|
<script src="view-models.js"></script>
|
|
|
|
<script>
|
|
async function testAPI() {
|
|
const resultDiv = document.getElementById('api-result');
|
|
resultDiv.innerHTML = 'Testing...';
|
|
|
|
try {
|
|
// Test cluster members API
|
|
const members = await window.apiClient.getClusterMembers();
|
|
console.log('Members:', members);
|
|
|
|
// Test discovery API
|
|
const discovery = await window.apiClient.getDiscoveryInfo();
|
|
console.log('Discovery:', discovery);
|
|
|
|
resultDiv.innerHTML = `
|
|
<div class="success">
|
|
✅ API Test Successful!<br>
|
|
Cluster Members: ${members.members?.length || 0}<br>
|
|
Primary Node: ${discovery.primaryNode || 'None'}<br>
|
|
Total Nodes: ${discovery.totalNodes || 0}
|
|
</div>
|
|
`;
|
|
} catch (error) {
|
|
console.error('API test failed:', error);
|
|
resultDiv.innerHTML = `<div class="error">❌ API Test Failed: ${error.message}</div>`;
|
|
}
|
|
}
|
|
|
|
function testFramework() {
|
|
const resultDiv = document.getElementById('framework-result');
|
|
resultDiv.innerHTML = 'Testing...';
|
|
|
|
try {
|
|
// Test framework classes
|
|
if (typeof EventBus !== 'undefined' &&
|
|
typeof ViewModel !== 'undefined' &&
|
|
typeof Component !== 'undefined') {
|
|
|
|
// Create a simple view model
|
|
const vm = new ViewModel();
|
|
vm.set('test', 'Hello World');
|
|
|
|
if (vm.get('test') === 'Hello World') {
|
|
resultDiv.innerHTML = `
|
|
<div class="success">
|
|
✅ Framework Test Successful!<br>
|
|
EventBus: ${typeof EventBus}<br>
|
|
ViewModel: ${typeof ViewModel}<br>
|
|
Component: ${typeof Component}<br>
|
|
ViewModel test: ${vm.get('test')}
|
|
</div>
|
|
`;
|
|
} else {
|
|
throw new Error('ViewModel get/set not working');
|
|
}
|
|
} else {
|
|
throw new Error('Framework classes not found');
|
|
}
|
|
} catch (error) {
|
|
console.error('Framework test failed:', error);
|
|
resultDiv.innerHTML = `<div class="error">❌ Framework Test Failed: ${error.message}</div>`;
|
|
}
|
|
}
|
|
|
|
// Initialize when page loads
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
console.log('Page loaded, framework ready');
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |