mirror of
https://github.com/everett7623/nodeloc_vps_test.git
synced 2025-01-23 21:46:19 +00:00
217 lines
6.0 KiB
HTML
217 lines
6.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Nodeloc Bench Result</title>
|
|
<link
|
|
rel="stylesheet"
|
|
href="https://fastly.jsdelivr.net/gh/highlightjs/cdn-release@11.9.0/build/styles/default.min.css"
|
|
/>
|
|
<style>
|
|
/* Root Variables */
|
|
:root {
|
|
--body-bg: #f5f5f5;
|
|
--text-color: #333;
|
|
--muted-color: #546e7a;
|
|
--border-radius: 8px;
|
|
--primary-color: #0d47a1;
|
|
--secondary-color: #e3f2fd;
|
|
--error-bg: #ffcdd2;
|
|
--loading-bg: #e3f2fd;
|
|
--font-family: Arial, sans-serif;
|
|
}
|
|
|
|
/* General Styles */
|
|
html,
|
|
body {
|
|
margin: 0;
|
|
padding: 0;
|
|
font-family: var(--font-family);
|
|
background: var(--body-bg);
|
|
color: var(--text-color);
|
|
height: 100%;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* Loading and Error States */
|
|
.status {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
height: 100px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 1.2rem;
|
|
font-weight: bold;
|
|
z-index: 999;
|
|
}
|
|
.status.loading {
|
|
background-color: var(--loading-bg);
|
|
color: var(--primary-color);
|
|
}
|
|
.status.error {
|
|
background-color: var(--error-bg);
|
|
color: #b71c1c;
|
|
}
|
|
|
|
/* Tabs Section */
|
|
.tabs-container {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: calc(100% - 100px);
|
|
overflow: hidden;
|
|
}
|
|
.tabs-header {
|
|
display: flex;
|
|
overflow-x: auto;
|
|
border-bottom: 1px solid var(--muted-color);
|
|
background: var(--secondary-color);
|
|
}
|
|
.tabs-header button {
|
|
padding: 10px 15px;
|
|
border: none;
|
|
background: transparent;
|
|
cursor: pointer;
|
|
flex: 0 0 auto;
|
|
font-size: 1rem;
|
|
font-weight: bold;
|
|
color: var(--text-color);
|
|
transition: background 0.3s, color 0.3s;
|
|
}
|
|
.tabs-header button.active {
|
|
background: var(--primary-color);
|
|
color: #fff;
|
|
}
|
|
.tabs-content {
|
|
flex-grow: 1;
|
|
padding: 20px;
|
|
overflow-y: auto;
|
|
background: #fff;
|
|
border-radius: 0 0 var(--border-radius) var(--border-radius);
|
|
}
|
|
|
|
/* Copy Button */
|
|
.copy-btn {
|
|
padding: 10px;
|
|
border: none;
|
|
border-radius: var(--border-radius);
|
|
background: var(--primary-color);
|
|
color: #fff;
|
|
font-size: 0.9rem;
|
|
cursor: pointer;
|
|
position: fixed;
|
|
bottom: 15px;
|
|
left: 15px;
|
|
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
|
|
transition: background 0.3s;
|
|
}
|
|
.copy-btn:hover {
|
|
background: #1565c0;
|
|
}
|
|
.copy-btn:active {
|
|
box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.3);
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<!-- Status Display -->
|
|
<div class="status loading">Loading...</div>
|
|
|
|
<!-- Tabs Container -->
|
|
<div class="tabs-container" style="display: none;">
|
|
<div class="tabs-header"></div>
|
|
<div class="tabs-content"></div>
|
|
</div>
|
|
|
|
<!-- Copy Button -->
|
|
<button class="copy-btn" data-clipboard-target="#copy-target">
|
|
Copy Result To Nodeloc
|
|
</button>
|
|
|
|
<!-- Hidden Textarea for Copy -->
|
|
<textarea id="copy-target" style="display: none;"></textarea>
|
|
|
|
<!-- Scripts -->
|
|
<script src="https://fastly.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js"></script>
|
|
<script src="https://fastly.jsdelivr.net/gh/highlightjs/cdn-release@11.9.0/build/highlight.min.js"></script>
|
|
<script src="https://fastly.jsdelivr.net/npm/clipboard@2.0.11/dist/clipboard.min.js"></script>
|
|
<script>
|
|
// Function to construct the file path based on year and month
|
|
function getFilePath(fileName) {
|
|
const match = fileName.match(/^NL(\d{4})(\d{2})/);
|
|
if (match) {
|
|
const year = match[1];
|
|
const month = match[2];
|
|
return `/${year}/${month}/${fileName}`;
|
|
}
|
|
return `/${fileName}`;
|
|
}
|
|
|
|
const fileNameMatch =
|
|
new URLSearchParams(window.location.search).get("filename") ||
|
|
location.pathname.split("/").pop();
|
|
|
|
if (fileNameMatch) {
|
|
const fileName = decodeURIComponent(fileNameMatch);
|
|
const filePath = getFilePath(fileName);
|
|
|
|
$.ajax({
|
|
url: filePath,
|
|
success: renderContent,
|
|
error: showError,
|
|
});
|
|
}
|
|
|
|
function renderContent(data) {
|
|
$("#copy-target").val(data);
|
|
$(".status").hide();
|
|
$(".tabs-container").show();
|
|
|
|
const tabsHeader = $(".tabs-header");
|
|
const tabsContent = $(".tabs-content");
|
|
tabsHeader.empty();
|
|
tabsContent.empty();
|
|
|
|
const allTabButton = $("<button>")
|
|
.text("All / 全部")
|
|
.addClass("active")
|
|
.on("click", () => switchTab("all", data));
|
|
tabsHeader.append(allTabButton);
|
|
|
|
const tabMatches = [...data.matchAll(/\[TAB=([^\]]+)]([\s\S]*?)\[\/TAB]/gi)];
|
|
tabMatches.forEach(([fullMatch, tabTitle, tabContent], index) => {
|
|
const tabId = `tab-${index}`;
|
|
const tabButton = $("<button>")
|
|
.text(tabTitle)
|
|
.on("click", () => switchTab(tabId, tabContent));
|
|
tabsHeader.append(tabButton);
|
|
});
|
|
|
|
switchTab("all", data);
|
|
new ClipboardJS(".copy-btn");
|
|
}
|
|
|
|
function switchTab(tabId, content) {
|
|
$(".tabs-header button").removeClass("active");
|
|
$(`.tabs-header button:contains(${tabId === "all" ? "All" : tabId})`).addClass("active");
|
|
|
|
$(".tabs-content").html(
|
|
`<pre><code class="language-bbcode">${content}</code></pre>`
|
|
);
|
|
hljs.highlightAll();
|
|
}
|
|
|
|
function showError() {
|
|
$(".status")
|
|
.removeClass("loading")
|
|
.addClass("error")
|
|
.text("无法加载数据文件，请检查 URL。");
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|