202 lines
6.0 KiB
JavaScript
202 lines
6.0 KiB
JavaScript
// ---------------------------------------------------------
|
|
// Tool tab navigation
|
|
// ---------------------------------------------------------
|
|
|
|
const toolTabs = document.querySelectorAll(".tool-tab");
|
|
const toolPanels = document.querySelectorAll(".tool-panel");
|
|
|
|
toolTabs.forEach((tab) => {
|
|
tab.addEventListener("click", () => {
|
|
const selectedToolId = tab.dataset.tool;
|
|
|
|
// Update the active tab.
|
|
toolTabs.forEach((currentTab) => {
|
|
currentTab.classList.toggle("active", currentTab === tab);
|
|
});
|
|
|
|
// Show only the selected tool panel.
|
|
toolPanels.forEach((panel) => {
|
|
panel.hidden = panel.id !== selectedToolId;
|
|
});
|
|
});
|
|
});
|
|
|
|
|
|
// ---------------------------------------------------------
|
|
// Website Status Checker
|
|
// ---------------------------------------------------------
|
|
|
|
const uptimeForm = document.getElementById("uptime-form");
|
|
const urlInput = document.getElementById("url-input");
|
|
const checkButton = document.getElementById("check-button");
|
|
const statusMessage = document.getElementById("status-message");
|
|
const resultPanel = document.getElementById("result-panel");
|
|
|
|
const onlineBadge = document.getElementById("online-badge");
|
|
const statusCode = document.getElementById("status-code");
|
|
const responseTime = document.getElementById("response-time");
|
|
const redirectCount = document.getElementById("redirect-count");
|
|
const checkedAt = document.getElementById("checked-at");
|
|
const finalUrl = document.getElementById("final-url");
|
|
|
|
uptimeForm.addEventListener("submit", async (event) => {
|
|
event.preventDefault();
|
|
|
|
const url = urlInput.value.trim();
|
|
|
|
statusMessage.textContent = "Checking website...";
|
|
statusMessage.className = "status-message";
|
|
resultPanel.hidden = true;
|
|
checkButton.disabled = true;
|
|
checkButton.textContent = "Checking...";
|
|
|
|
try {
|
|
const response = await fetch("/api/uptime", {
|
|
method: "POST",
|
|
headers: {
|
|
"Content-Type": "application/json",
|
|
},
|
|
body: JSON.stringify({ url }),
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (!response.ok) {
|
|
throw new Error(result.error || "The request failed.");
|
|
}
|
|
|
|
if (!result.online) {
|
|
throw new Error(result.error || "The website could not be reached.");
|
|
}
|
|
|
|
onlineBadge.textContent = "Online";
|
|
onlineBadge.className = "status-badge online";
|
|
|
|
statusCode.textContent = result.statusCode;
|
|
responseTime.textContent = `${result.responseTimeMs} ms`;
|
|
redirectCount.textContent = result.redirectCount;
|
|
checkedAt.textContent = new Date(result.checkedAt).toLocaleString();
|
|
|
|
finalUrl.textContent = result.finalUrl;
|
|
finalUrl.href = result.finalUrl;
|
|
|
|
statusMessage.textContent = "Website check completed.";
|
|
resultPanel.hidden = false;
|
|
} catch (error) {
|
|
statusMessage.textContent = error.message;
|
|
statusMessage.className = "status-message error";
|
|
} finally {
|
|
checkButton.disabled = false;
|
|
checkButton.textContent = "Check Website";
|
|
}
|
|
});
|
|
|
|
|
|
// ---------------------------------------------------------
|
|
// DNS Lookup
|
|
// ---------------------------------------------------------
|
|
|
|
const dnsForm = document.getElementById("dns-form");
|
|
const hostnameInput = document.getElementById("hostname-input");
|
|
const dnsButton = document.getElementById("dns-button");
|
|
const dnsMessage = document.getElementById("dns-message");
|
|
const dnsResultPanel = document.getElementById("dns-result-panel");
|
|
const dnsHostname = document.getElementById("dns-hostname");
|
|
const dnsRecords = document.getElementById("dns-records");
|
|
const dnsCheckedAt = document.getElementById("dns-checked-at");
|
|
|
|
// Convert one DNS record into readable text.
|
|
function formatDnsRecord(recordType, record) {
|
|
if (recordType === "MX" && typeof record === "object") {
|
|
return `${record.exchange} (priority ${record.priority})`;
|
|
}
|
|
|
|
return String(record);
|
|
}
|
|
|
|
// Build one visible record group.
|
|
function createDnsRecordGroup(recordType, records) {
|
|
const group = document.createElement("section");
|
|
group.className = "dns-record-group";
|
|
|
|
const heading = document.createElement("h4");
|
|
heading.textContent = recordType;
|
|
group.appendChild(heading);
|
|
|
|
if (!Array.isArray(records) || records.length === 0) {
|
|
const emptyMessage = document.createElement("p");
|
|
emptyMessage.className = "empty-record";
|
|
emptyMessage.textContent = "No records found.";
|
|
group.appendChild(emptyMessage);
|
|
|
|
return group;
|
|
}
|
|
|
|
const list = document.createElement("ul");
|
|
list.className = "dns-record-list";
|
|
|
|
records.forEach((record) => {
|
|
const item = document.createElement("li");
|
|
item.textContent = formatDnsRecord(recordType, record);
|
|
list.appendChild(item);
|
|
});
|
|
|
|
group.appendChild(list);
|
|
|
|
return group;
|
|
}
|
|
|
|
dnsForm.addEventListener("submit", async (event) => {
|
|
event.preventDefault();
|
|
|
|
const hostname = hostnameInput.value.trim();
|
|
|
|
dnsMessage.textContent = "Looking up DNS records...";
|
|
dnsMessage.className = "status-message";
|
|
dnsResultPanel.hidden = true;
|
|
dnsButton.disabled = true;
|
|
dnsButton.textContent = "Looking Up...";
|
|
|
|
try {
|
|
const response = await fetch("/api/dns", {
|
|
method: "POST",
|
|
headers: {
|
|
"Content-Type": "application/json",
|
|
},
|
|
body: JSON.stringify({ hostname }),
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (!response.ok) {
|
|
throw new Error(result.error || "The DNS lookup failed.");
|
|
}
|
|
|
|
dnsHostname.textContent = result.hostname;
|
|
dnsRecords.replaceChildren();
|
|
|
|
const recordOrder = ["A", "AAAA", "CNAME", "MX", "TXT", "NS"];
|
|
|
|
recordOrder.forEach((recordType) => {
|
|
const group = createDnsRecordGroup(
|
|
recordType,
|
|
result.records[recordType]
|
|
);
|
|
|
|
dnsRecords.appendChild(group);
|
|
});
|
|
|
|
dnsCheckedAt.textContent =
|
|
`Checked ${new Date(result.checkedAt).toLocaleString()}`;
|
|
|
|
dnsMessage.textContent = "DNS lookup completed.";
|
|
dnsResultPanel.hidden = false;
|
|
} catch (error) {
|
|
dnsMessage.textContent = error.message;
|
|
dnsMessage.className = "status-message error";
|
|
} finally {
|
|
dnsButton.disabled = false;
|
|
dnsButton.textContent = "Look Up DNS";
|
|
}
|
|
});
|