pms_md 1.0.0

package/node-monitor/examples/views/health.ejs

@@ -0,0 +1,21 @@
+<%- include('partials/header') %>
+
+<div class="health-header">
+    <div class="status-indicator" id="statusIndicator">
+        <div class="pulse"></div>
+        <span id="statusText">Checking health...</span>
+    </div>
+</div>
+
+<div id="healthContent">
+    <div class="loading">
+        <div class="spinner"></div>
+        <p>Loading health data...</p>
+    </div>
+</div>
+
+<div class="action-buttons">
+    <button class="refresh-btn" onclick="loadHealth()">🔄 Refresh Health Check</button>
+</div>
+
+<%- include('partials/footer') %>

package/node-monitor/examples/views/home.ejs

@@ -0,0 +1,341 @@
+<%- include('partials/header') %>
+
+<div class="home-container">
+    <div class="hero">
+        <h1 class="hero-title">📊 Project Monitoring System</h1>
+        <p class="hero-subtitle">Real-time Application Monitoring & Health Checks</p>
+    </div>
+
+    <div class="links-grid">
+        <a href="/monitor/dashboard" class="link-card">
+            <div class="link-icon">📊</div>
+            <div class="link-title">Dashboard</div>
+            <div class="link-desc">Complete monitoring overview</div>
+        </a>
+        
+        <a href="/health" class="link-card">
+            <div class="link-icon">💚</div>
+            <div class="link-title">Health Check</div>
+            <div class="link-desc">System health status</div>
+        </a>
+        
+        <a href="/monitor/metrics" class="link-card">
+            <div class="link-icon">📈</div>
+            <div class="link-title">Metrics</div>
+            <div class="link-desc">Performance charts</div>
+        </a>
+    </div>
+    
+    <div class="api-section">
+        <h2>🔧 Test Endpoints</h2>
+        <div class="api-links">
+            <button onclick="testEndpoint('/api/success', 'Success')" class="api-link">✓ Success</button>
+            <button onclick="testEndpoint('/api/error', 'Error')" class="api-link">✗ Error</button>
+            <button onclick="testEndpoint('/api/slow', 'Slow Request')" class="api-link">⏱ Slow Request</button>
+            <button onclick="testEndpoint('/monitor/status?format=json', 'Status JSON')" class="api-link">📋 Status JSON</button>
+            <button onclick="testEndpoint('/api/notify-test', 'Test Email')" class="api-link" style="background: linear-gradient(135deg, #10b981, #059669); color: white; border: none;">📧 Test Email</button>
+        </div>
+    </div>
+
+    <!-- Modal for API responses -->
+    <div id="apiModal" class="modal">
+        <div class="modal-content">
+            <span class="modal-close" onclick="closeModal()">&times;</span>
+            <h2 id="modalTitle">API Response</h2>
+            <div id="modalBody"></div>
+        </div>
+    </div>
+
+    <style>
+        .modal {
+            display: none;
+            position: fixed;
+            z-index: 999;
+            left: 0;
+            top: 0;
+            width: 100%;
+            height: 100%;
+            background-color: rgba(0, 0, 0, 0.5);
+            animation: fadeIn 0.3s ease;
+        }
+
+        @keyframes fadeIn {
+            from { opacity: 0; }
+            to { opacity: 1; }
+        }
+
+        .modal-content {
+            background: var(--card-bg);
+            margin: 10% auto;
+            padding: 30px;
+            border-radius: 12px;
+            width: 90%;
+            max-width: 600px;
+            box-shadow: 0 10px 40px var(--card-shadow);
+            animation: slideDown 0.3s ease;
+            position: relative;
+        }
+
+        @keyframes slideDown {
+            from {
+                transform: translateY(-50px);
+                opacity: 0;
+            }
+            to {
+                transform: translateY(0);
+                opacity: 1;
+            }
+        }
+
+        .modal-close {
+            position: absolute;
+            right: 20px;
+            top: 20px;
+            font-size: 28px;
+            font-weight: bold;
+            color: var(--text-secondary);
+            cursor: pointer;
+            transition: color 0.2s;
+        }
+
+        .modal-close:hover {
+            color: var(--text-primary);
+        }
+
+        #modalTitle {
+            margin-top: 0;
+            color: var(--text-primary);
+            font-size: 1.5em;
+        }
+
+        #modalBody {
+            margin-top: 20px;
+            padding: 20px;
+            background: var(--nav-bg);
+            border-radius: 8px;
+            border-left: 4px solid #667eea;
+        }
+
+        .api-link {
+            cursor: pointer;
+            border: none;
+            font-family: inherit;
+            font-size: inherit;
+            text-align: center;
+        }
+
+        .response-success {
+            color: #10b981;
+            font-weight: 600;
+        }
+
+        .response-error {
+            color: #ef4444;
+            font-weight: 600;
+        }
+
+        .response-data {
+            background: #1f2937;
+            color: #10b981;
+            padding: 15px;
+            border-radius: 6px;
+            font-family: 'Courier New', monospace;
+            margin-top: 10px;
+            overflow-x: auto;
+            position: relative;
+            max-height: 400px;
+            overflow-y: auto;
+        }
+
+        .copy-btn {
+            position: absolute;
+            top: 10px;
+            right: 10px;
+            background: #667eea;
+            color: white;
+            border: none;
+            padding: 6px 12px;
+            border-radius: 4px;
+            cursor: pointer;
+            font-size: 0.85em;
+            transition: background 0.2s;
+        }
+
+        .copy-btn:hover {
+            background: #5568d3;
+        }
+
+        .copy-btn.copied {
+            background: #10b981;
+        }
+
+        .loading {
+            display: inline-block;
+            width: 20px;
+            height: 20px;
+            border: 3px solid #f3f3f3;
+            border-top: 3px solid #667eea;
+            border-radius: 50%;
+            animation: spin 1s linear infinite;
+        }
+
+        @keyframes spin {
+            0% { transform: rotate(0deg); }
+            100% { transform: rotate(360deg); }
+        }
+    </style>
+
+    <script>
+        async function testEndpoint(url, name) {
+            const modal = document.getElementById('apiModal');
+            const modalTitle = document.getElementById('modalTitle');
+            const modalBody = document.getElementById('modalBody');
+
+            // Show modal with loading state
+            modalTitle.textContent = `Testing: ${name}`;
+            modalBody.innerHTML = '<div class="loading"></div> <span style="margin-left: 10px;">Calling API...</span>';
+            modal.style.display = 'block';
+
+            const startTime = Date.now();
+
+            try {
+                const response = await fetch(url);
+                const duration = Date.now() - startTime;
+                const data = await response.json();
+
+                const jsonString = JSON.stringify(data, null, 2);
+
+                // Special handling for email test response
+                if (name === 'Test Email' && data.result && data.result.status === 'fulfilled') {
+                    const emailData = data.result.value;
+                    modalBody.innerHTML = `
+                        <div class="response-success">✓ Email Sent Successfully!</div>
+                        <div style="margin-top: 15px; padding: 15px; background: #f0fdf4; border-left: 4px solid #10b981; border-radius: 6px;">
+                            <div style="color: #065f46; margin-bottom: 8px;">
+                                <strong>📧 Email Details:</strong>
+                            </div>
+                            <div style="color: #047857; font-size: 0.95em; line-height: 1.6;">
+                                <strong>Message:</strong> ${emailData.message || 'Test notification sent'}<br>
+                                <strong>To:</strong> ${emailData.instructions || 'Check your email inbox at manish.prajapati@gmail.com'}<br>
+                                <strong>Duration:</strong> ${duration}ms
+                            </div>
+                        </div>
+                        <div style="margin-top: 15px; padding: 12px; background: #eff6ff; border-left: 4px solid #3b82f6; border-radius: 6px;">
+                            <div style="color: #1e40af; font-size: 0.9em;">
+                                💡 <strong>Tip:</strong> Check your email inbox for the test notification
+                            </div>
+                        </div>
+                        <details style="margin-top: 15px;">
+                            <summary style="cursor: pointer; color: #6b7280; font-weight: 600; padding: 8px; background: #f9fafb; border-radius: 4px;">
+                                📋 View Full Response
+                            </summary>
+                            <div style="position: relative; margin-top: 10px;">
+                                <button class="copy-btn" onclick="copyJSON(this, \`${jsonString.replace(/`/g, '\\`')}\`)">📋 Copy</button>
+                                <div class="response-data">${jsonString}</div>
+                            </div>
+                        </details>
+                    `;
+                } else if (response.ok) {
+                    modalBody.innerHTML = `
+                        <div class="response-success">✓ Success (${response.status})</div>
+                        <div style="margin-top: 10px; color: #6b7280;">
+                            <strong>Duration:</strong> ${duration}ms<br>
+                            <strong>Status:</strong> ${response.status} ${response.statusText}
+                        </div>
+                        <div style="position: relative;">
+                            <button class="copy-btn" onclick="copyJSON(this, \`${jsonString.replace(/`/g, '\\`')}\`)">📋 Copy</button>
+                            <div class="response-data">${jsonString}</div>
+                        </div>
+                    `;
+                } else {
+                    modalBody.innerHTML = `
+                        <div class="response-error">✗ Error (${response.status})</div>
+                        <div style="margin-top: 10px; color: #6b7280;">
+                            <strong>Duration:</strong> ${duration}ms<br>
+                            <strong>Status:</strong> ${response.status} ${response.statusText}
+                        </div>
+                        <div style="position: relative;">
+                            <button class="copy-btn" onclick="copyJSON(this, \`${jsonString.replace(/`/g, '\\`')}\`)">📋 Copy</button>
+                            <div class="response-data">${jsonString}</div>
+                        </div>
+                    `;
+                }
+            } catch (error) {
+                const duration = Date.now() - startTime;
+                modalBody.innerHTML = `
+                    <div class="response-error">✗ Request Failed</div>
+                    <div style="margin-top: 10px; color: #6b7280;">
+                        <strong>Duration:</strong> ${duration}ms<br>
+                        <strong>Error:</strong> ${error.message}
+                    </div>
+                `;
+            }
+        }
+
+        function closeModal() {
+            document.getElementById('apiModal').style.display = 'none';
+        }
+
+        function copyJSON(button, text) {
+            navigator.clipboard.writeText(text).then(() => {
+                const originalText = button.textContent;
+                button.textContent = '✓ Copied!';
+                button.classList.add('copied');
+
+                setTimeout(() => {
+                    button.textContent = originalText;
+                    button.classList.remove('copied');
+                }, 2000);
+            }).catch(err => {
+                console.error('Failed to copy:', err);
+                button.textContent = '✗ Failed';
+                setTimeout(() => {
+                    button.textContent = '📋 Copy';
+                }, 2000);
+            });
+        }
+
+        // Close modal when clicking outside
+        window.onclick = function(event) {
+            const modal = document.getElementById('apiModal');
+            if (event.target === modal) {
+                closeModal();
+            }
+        }
+
+        // Close modal with Escape key
+        document.addEventListener('keydown', function(event) {
+            if (event.key === 'Escape') {
+                closeModal();
+            }
+        });
+    </script>
+
+    <div class="features-section">
+        <h2>✨ Features</h2>
+        <div class="features-grid">
+            <div class="feature-item">
+                <div class="feature-icon">⚡</div>
+                <h3>Real-time Monitoring</h3>
+                <p>Live updates every 10-30 seconds</p>
+            </div>
+            <div class="feature-item">
+                <div class="feature-icon">📊</div>
+                <h3>Interactive Charts</h3>
+                <p>Visualize CPU and memory usage</p>
+            </div>
+            <div class="feature-item">
+                <div class="feature-icon">🔔</div>
+                <h3>Smart Alerts</h3>
+                <p>Email and Slack notifications</p>
+            </div>
+            <div class="feature-item">
+                <div class="feature-icon">💾</div>
+                <h3>Error Tracking</h3>
+                <p>Comprehensive error logging</p>
+            </div>
+        </div>
+    </div>
+</div>
+
+<%- include('partials/footer') %>

package/node-monitor/examples/views/layout.ejs

@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title><%= title %> - Node Monitor</title>
+    <link rel="stylesheet" href="/css/style.css">
+    <script src="/js/theme.js"></script>
+    <% if (includeCharts) { %>
+    <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js"></script>
+    <% } %>
+</head>
+<body>
+    <div class="container">
+        <!-- Header -->
+        <div class="header">
+            <h1><%= headerIcon %> <%= headerTitle %></h1>
+            <% if (subtitle) { %>
+            <p class="subtitle"><%= subtitle %></p>
+            <% } %>
+            
+            <!-- Navigation -->
+            <div class="nav-links">
+                <a href="/" class="nav-link <%= currentPage === 'home' ? 'active' : '' %>">🏠 Home</a>
+                <a href="/monitor/dashboard" class="nav-link <%= currentPage === 'dashboard' ? 'active' : '' %>">📊 Dashboard</a>
+                <a href="/health" class="nav-link <%= currentPage === 'health' ? 'active' : '' %>">💚 Health</a>
+                <a href="/monitor/metrics" class="nav-link <%= currentPage === 'metrics' ? 'active' : '' %>">📈 Metrics</a>
+                <a href="/monitor/status" class="nav-link" target="_blank">📋 API</a>
+            </div>
+        </div>
+
+        <!-- Main Content -->
+        <div id="mainContent">
+            <%- body %>
+        </div>
+
+        <!-- Footer -->
+        <div class="footer">
+            <p>Node Monitor v1.0.0 | Built with ❤️ By Manish Desai</p>
+            <p class="timestamp" id="lastUpdate"></p>
+        </div>
+    </div>
+
+    <script src="/js/main.js"></script>
+    <% if (pageScript) { %>
+    <script src="/js/<%= pageScript %>"></script>
+    <% } %>
+</body>
+</html>
+

package/node-monitor/examples/views/metrics.ejs

@@ -0,0 +1,16 @@
+<%- include('partials/header') %>
+
+<div id="statsContent">
+    <div class="loading">
+        <div class="spinner"></div>
+        <p>Loading metrics data...</p>
+    </div>
+</div>
+
+<div id="chartsContent"></div>
+
+<div class="action-buttons">
+    <button class="refresh-btn" onclick="loadMetrics()">🔄 Refresh Metrics</button>
+</div>
+
+<%- include('partials/footer') %>

package/node-monitor/examples/views/partials/footer.ejs

@@ -0,0 +1,16 @@
+        </div>
+
+        <!-- Footer -->
+        <div class="footer">
+            <p>Node Monitor v1.0.0 | Built with ❤️ By Manish Desai</p>
+            <p class="timestamp" id="lastUpdate"></p>
+        </div>
+    </div>
+
+    <script src="/js/main.js"></script>
+    <% if (typeof pageScript !== 'undefined' && pageScript) { %>
+    <script src="/js/<%= pageScript %>"></script>
+    <% } %>
+</body>
+</html>
+

package/node-monitor/examples/views/partials/header.ejs

@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title><%= title %> - Node Monitor</title>
+    <link rel="stylesheet" href="/css/style.css">
+    <script src="/js/theme.js"></script>
+    <% if (typeof includeCharts !== 'undefined' && includeCharts) { %>
+    <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js"></script>
+    <% } %>
+</head>
+<body>
+    <div class="container">
+        <!-- Header -->
+        <div class="header">
+            <h1><%= headerIcon %> <%= headerTitle %></h1>
+            <% if (typeof subtitle !== 'undefined' && subtitle) { %>
+            <p class="subtitle"><%= subtitle %></p>
+            <% } %>
+            
+            <!-- Navigation -->
+            <div class="nav-links">
+                <a href="/" class="nav-link <%= currentPage === 'home' ? 'active' : '' %>">🏠 Home</a>
+                <a href="/monitor/dashboard" class="nav-link <%= currentPage === 'dashboard' ? 'active' : '' %>">📊 Dashboard</a>
+                <a href="/health" class="nav-link <%= currentPage === 'health' ? 'active' : '' %>">💚 Health</a>
+                <a href="/monitor/metrics" class="nav-link <%= currentPage === 'metrics' ? 'active' : '' %>">📈 Metrics</a>
+                <a href="/monitor/status" class="nav-link <%= currentPage === 'status' ? 'active' : '' %>">📋 Status</a>
+                <a href="/monitor/error-logs" class="nav-link <%= currentPage === 'error-logs' ? 'active' : '' %>">🔴 Error Logs</a>
+            </div>
+        </div>
+
+        <!-- Main Content -->
+        <div id="mainContent">
+

package/node-monitor/examples/views/partials/nav.ejs

@@ -0,0 +1,23 @@
+<!-- Navigation Only Partial (no HTML/HEAD/BODY tags) -->
+<div class="container">
+    <!-- Header -->
+    <div class="header">
+        <h1><%= headerIcon %> <%= headerTitle %></h1>
+        <% if (typeof subtitle !== 'undefined' && subtitle) { %>
+        <p class="subtitle"><%= subtitle %></p>
+        <% } %>
+        
+        <!-- Navigation -->
+        <div class="nav-links">
+            <a href="/" class="nav-link <%= currentPage === 'home' ? 'active' : '' %>">🏠 Home</a>
+            <a href="/monitor/dashboard" class="nav-link <%= currentPage === 'dashboard' ? 'active' : '' %>">📊 Dashboard</a>
+            <a href="/health" class="nav-link <%= currentPage === 'health' ? 'active' : '' %>">💚 Health</a>
+            <a href="/monitor/metrics" class="nav-link <%= currentPage === 'metrics' ? 'active' : '' %>">📈 Metrics</a>
+            <a href="/monitor/status" class="nav-link <%= currentPage === 'status' ? 'active' : '' %>">📋 Status</a>
+            <a href="/monitor/error-logs" class="nav-link <%= currentPage === 'error-logs' ? 'active' : '' %>">🔴 Error Logs</a>
+        </div>
+    </div>
+
+    <!-- Main Content -->
+    <div id="mainContent">
+