Browser Manager MCP Server
by DeamonDev888
status.html•5.24 kB
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Browser Manager MCP - Tableau de Bord Professionnel</title>
<style>
/* Base styles */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
line-height: 1.6;
color: #374151;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
min-height: 100vh;
}
/* Loading spinner */
.loading-container {
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background: white;
}
.spinner {
width: 40px;
height: 40px;
border: 4px solid #f3f4f6;
border-top: 4px solid #3b82f6;
border-radius: 50%;
animation: spin 1s linear infinite;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.loading-text {
margin-top: 16px;
color: #6b7280;
font-size: 14px;
}
/* Error state */
.error-container {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
min-height: 100vh;
background: white;
padding: 20px;
text-align: center;
}
.error-icon {
width: 64px;
height: 64px;
color: #ef4444;
margin-bottom: 16px;
}
.error-title {
font-size: 20px;
font-weight: 600;
color: #374151;
margin-bottom: 8px;
}
.error-message {
color: #6b7280;
margin-bottom: 24px;
max-width: 400px;
}
.retry-button {
background: #3b82f6;
color: white;
border: none;
padding: 12px 24px;
border-radius: 8px;
font-size: 14px;
font-weight: 500;
cursor: pointer;
transition: background-color 0.2s;
}
.retry-button:hover {
background: #2563eb;
}
/* Hide main content initially */
#root {
display: none;
}
#root.loaded {
display: block;
}
</style>
</head>
<body>
<!-- Loading State -->
<div id="loading" class="loading-container">
<div>
<div class="spinner"></div>
<div class="loading-text">Chargement du tableau de bord professionnel...</div>
</div>
</div>
<!-- Error State -->
<div id="error" class="error-container" style="display: none;">
<svg class="error-icon" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>
<h2 class="error-title">Erreur de chargement</h2>
<p class="error-message">
Une erreur est survenue lors du chargement du tableau de bord. Veuillez réessayer.
</p>
<button class="retry-button" onclick="retryLoading()">Réessayer</button>
</div>
<!-- Main React App -->
<div id="root"></div>
<!-- React and App Scripts -->
<script>
let retryCount = 0;
const maxRetries = 3;
function showError() {
document.getElementById('loading').style.display = 'none';
document.getElementById('error').style.display = 'flex';
}
function showApp() {
document.getElementById('loading').style.display = 'none';
document.getElementById('error').style.display = 'none';
document.getElementById('root').classList.add('loaded');
}
function retryLoading() {
retryCount++;
if (retryCount <= maxRetries) {
location.reload();
} else {
document.querySelector('.error-message').textContent =
'Plusieurs tentatives de chargement ont échoué. Veuillez recharger l\'extension.';
}
}
function loadApp() {
// Load React app
const script = document.createElement('script');
script.type = 'module';
script.src = './status.js';
script.onload = () => {
console.log('Professional Status app loaded successfully');
showApp();
};
script.onerror = (error) => {
console.error('Failed to load Professional Status app:', error);
showError();
};
// Fallback timeout
setTimeout(() => {
if (document.getElementById('loading').style.display !== 'none') {
console.warn('App loading timeout, showing error');
showError();
}
}, 10000); // 10 seconds timeout
document.head.appendChild(script);
}
// Initialize app when DOM is ready
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', loadApp);
} else {
loadApp();
}
// Handle errors globally
window.addEventListener('error', (event) => {
console.error('Global error:', event.error);
if (retryCount === 0) {
showError();
}
});
window.addEventListener('unhandledrejection', (event) => {
console.error('Unhandled promise rejection:', event.reason);
if (retryCount === 0) {
showError();
}
});
</script>
</body>
</html>
Latest Blog Posts
- MCP Moves to the Linux Foundation: Neutral Stewardship for Agentic InfrastructureBy Om-Shree-0709 on .mcpanthropicLinux Foundation
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/DeamonDev888/Browser-Manager-MCP-Server'
If you have feedback or need assistance with the MCP directory API, please join our Discord server