‘;
return;
}

const recentHistory = this.history.slice(-20).reverse();

historyEl.innerHTML = recentHistory.map(item => `

`).join(”);
}

async performCheck() {
if (!this.isMonitoring || !this.currentUrl) return;

// Update status to checking
const statusEl = document.getElementById(‘statusValue’);
statusEl.innerHTML = ‘Checking‘;

try {
const result = await this.checkWebsite(this.currentUrl);
this.history.push(result);

// Keep only last 100 entries to manage memory
if (this.history.length > 100) {
this.history = this.history.slice(-100);
}

this.updateMetrics();
this.updateCharts();
this.updateHistory();
} catch (error) {
console.error(‘Monitoring error:’, error);
document.querySelector(‘.monitor-form’).insertAdjacentHTML(‘beforeend’,
`

`);

setTimeout(() => {
const errorMsg = document.querySelector(‘.error-message’);
if (errorMsg) errorMsg.remove();
}, 5000);
}
}

start(url, interval) {
if (this.isMonitoring) {
this.stop();
}

this.currentUrl = url;
this.checkInterval = interval * 1000;
this.isMonitoring = true;

// Perform first check immediately
this.performCheck();

// Set up interval for subsequent checks
this.monitoringInterval = setInterval(() => {
this.performCheck();
}, this.checkInterval);

// Update UI
document.querySelector(‘button[onclick=”startMonitoring()”]’).disabled = true;
document.querySelector(‘button[onclick=”stopMonitoring()”]’).disabled = false;
}

stop() {
this.isMonitoring = false;
if (this.monitoringInterval) {
clearInterval(this.monitoringInterval);
this.monitoringInterval = null;
}

// Update status
const statusEl = document.getElementById(‘statusValue’);
statusEl.innerHTML = ‘Stopped’;

// Update UI
document.querySelector(‘button[onclick=”startMonitoring()”]’).disabled = false;
document.querySelector(‘button[onclick=”stopMonitoring()”]’).disabled = true;
}
}

const monitor = new PerformanceMonitor();

function startMonitoring() {
const url = document.getElementById(‘urlInput’).value.trim();
const interval = parseInt(document.getElementById(‘intervalInput’).value);

if (!url) {
alert(‘Please enter a valid URL’);
return;
}

if (!url.startsWith(‘http://’) && !url.startsWith(‘https://’)) {
alert(‘URL must start with http:// or https://’);
return;
}

if (interval < 5 || interval > 300) {
alert(‘Check interval must be between 5 and 300 seconds’);
return;
}

monitor.start(url, interval);
}

function stopMonitoring() {
monitor.stop();
}

// Initialize disabled state
document.addEventListener(‘DOMContentLoaded’, function() {
document.querySelector(‘button[onclick=”stopMonitoring()”]’).disabled = true;
});