⚡ Initializing MTR trace...
▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓ 100%
`;
const url = `${window.location.pathname}?action=traceroute&target=${encodeURIComponent(target)}`;
fetch(url)
.then(response => {
if (!response.ok) {
throw new Error(`HTTP ${response.status}`);
}
const contentType = response.headers.get('content-type');
if (!contentType || !contentType.includes('application/json')) {
return response.text().then(text => {
throw new Error('Server returned non-JSON response: ' + text.substring(0, 100));
});
}
return response.json();
})
.then(data => {
console.log('API Response:', data);
if (data.error) {
if (data.fallback) {
console.log('Using fallback data due to API error:', data.error);
if (data.debug_info) {
console.log('Debug Info:', data.debug_info);
}
displayResults(data.fallback);
} else {
showError(data.error);
}
} else {
displayResults(data);
}
})
.catch(error => {
console.error('Fetch Error:', error);
showError('🚨 Network error: ' + error.message);
})
.finally(() => {
button.disabled = false;
button.textContent = 'TRACE ROUTE';
});
}
function displayResults(data) {
const resultsDiv = document.getElementById('results');
// Build terminal header
let output = '';
output += `root@cyberkendra:~#
`;
output += `cytools --report-wide --report-cycles=2 ${data.target}
`;
// Info section
output += ``;
output += `
📊 Network Analysis Report
`;
output += `
🎯 Target: ${data.target}
`;
output += `
⏰ Timestamp: ${data.timestamp}
`;
if (data.test_id) {
output += `
🆔 Test ID: ${data.test_id}
`;
}
output += `
`;
// Hop results with flags
if (data.hops && data.hops.length > 0) {
data.hops.forEach(hop => {
const flag = getCountryFlag(hop.host);
const hopClass = hop.status === 'timeout' ? 'timeout' : '';
output += `
${hop.hop.toString().padStart(2, '0')}
${flag}
${hop.host}
${hop.timings}
`;
});
} else {
output += '❌ No route to host or destination unreachable
';
}
// Enhanced summary
const successfulHops = data.hops ? data.hops.filter(h => h.status === 'success').length : 0;
const timeoutHops = data.hops ? data.hops.filter(h => h.status === 'timeout').length : 0;
const lossyHops = data.hops ? data.hops.filter(h => h.loss && h.loss > 0 && h.status === 'success').length : 0;
output += `
📈 Network Statistics Summary
📍 Total Hops
${data.total_hops}
✅ Successful
${successfulHops}
⏱️ Timeouts
${timeoutHops}
`;
// JSON toggle if available
if (data.raw_api_response) {
output += `
${JSON.stringify(data.raw_api_response, null, 2)}
`;
}
// Build complete terminal
const resultHTML = `
`;
resultsDiv.innerHTML = resultHTML;
}
function getSourceDisplay(source) {
const sourceMap = {
'siterelic_api': '🌐 SiteRelic MTR API (Live Data)',
'simulation': '🎭 Enhanced Simulation',
'enhanced_simulation': '🎭 Enhanced Simulation (API Unavailable)',
'unknown': '❓ Unknown Source'
};
return sourceMap[source] || source;
}
function showError(message) {
const resultsDiv = document.getElementById('results');
resultsDiv.innerHTML = `
⚠️ Error Occurred
${message}
`;
}
function toggleJsonData() {
const jsonDiv = document.getElementById('jsonData');
const button = document.querySelector('.json-toggle');
if (jsonDiv.style.display === 'none' || jsonDiv.style.display === '') {
jsonDiv.style.display = 'block';
button.textContent = '📄 Hide Raw Data';
} else {
jsonDiv.style.display = 'none';
button.textContent = '📄 Show Raw Data';
}
}
// Enhanced keyboard support
document.addEventListener('DOMContentLoaded', function() {
const input = document.getElementById('target');
if (input) {
input.addEventListener('keypress', function(e) {
if (e.key === 'Enter') {
runTraceroute();
}
}); // Auto-focus on load
input.focus();
// Add some example targets on double-click
input.addEventListener('dblclick', function() {
const examples = ['google.com', 'facebook.com', '8.8.8.8', 'cloudflare.com', 'github.com'];
const randomExample = examples[Math.floor(Math.random() * examples.length)];
input.value = randomExample;
});
}
});