Open Source

2025-04-22 09:11:40 +08:00
commit a4bf39a958
14 changed files with 1043 additions and 0 deletions
--- a/frontend/v2/script.js
+++ b/frontend/v2/script.js
@@ -0,0 +1,108 @@
+let allData = [];
+let currentActive = null;
+
+// 定义一个函数，用于将字符串中的反斜杠替换为正斜杠
+function sanitize(str) {
+  return str.replaceAll("\\", "/");
+}
+
+function renderList(data) {
+  const list = document.getElementById("resourceList");
+  list.innerHTML = "";
+
+  data.forEach((item, index) => {
+    const li = document.createElement("li");
+    li.setAttribute("data-index", index);
+
+    const thumb = item.images?.[0] ? sanitize(item.images[0]) : "";
+    const name = item.title;
+    const assets = item.properties?.Assets || "未知";
+
+    li.innerHTML = `
+      <img src="${thumb}" class="thumb" alt="">
+      <div>
+        <div><strong>${name}</strong></div>
+        <div style="font-size:0.85rem; color: #666;">素材量: ${assets}</div>
+      </div>
+    `;
+
+    li.addEventListener("click", () => showDetails(item, li));
+    list.appendChild(li);
+  });
+}
+
+function showDetails(item, li) {
+  if (currentActive) currentActive.classList.remove("active");
+  currentActive = li;
+  currentActive.classList.add("active");
+
+  document.getElementById("placeholder").classList.add("hidden");
+  document.getElementById("details").classList.remove("hidden");
+
+  document.getElementById("detailTitle").textContent = item.title;
+  document.getElementById("detailTags").textContent = `分类: ${
+    item.properties?.Category?.[0] || "N/A"
+  } | 标签: ${(item.properties?.Tags || []).join(", ")}`;
+
+  // 下载链接
+  const download = sanitize(item.download);
+  document.getElementById(
+    "downloadBlock"
+  ).innerHTML = `<a class="download-btn" href="${download}" download>⬇️ 下载资源</a>`;
+
+  // 图集
+  const gallery = document.createElement("div");
+  gallery.id = "gallery";
+  item.images?.forEach((img) => {
+    img = sanitize(img);
+    const a = document.createElement("a");
+    a.href = img;
+    a.innerHTML = `<img src="${img}" alt="">`;
+    gallery.appendChild(a);
+  });
+  const galleryWrapper = document.getElementById("galleryWrapper");
+  galleryWrapper.innerHTML = "";
+  galleryWrapper.appendChild(gallery);
+
+  lightGallery(gallery, {
+    selector: "a",
+    thumbnail: true,
+    zoom: true,
+  });
+
+  // 版本信息
+  const versionBlock = document.getElementById("versionTableWrapper");
+  if (item.changelog?.length > 0) {
+    let table = `<table><tr><th>日期</th><th>版本</th><th>描述</th></tr>`;
+    item.changelog.forEach((row) => {
+      table += `<tr><td>${row.date}</td><td>${row.version}</td><td>${
+        row.description || ""
+      }</td></tr>`;
+    });
+    table += `</table>`;
+    versionBlock.innerHTML = table;
+  } else {
+    versionBlock.innerHTML = "";
+  }
+}
+
+function handleSearch() {
+  const keyword = document
+    .getElementById("searchInput")
+    .value.trim()
+    .toLowerCase();
+  const filtered = allData.filter((item) =>
+    item.title.toLowerCase().includes(keyword)
+  );
+  renderList(filtered);
+}
+
+fetch("data/kenney_data_local.json")
+  .then((res) => res.json())
+  .then((data) => {
+    allData = data;
+    renderList(data);
+    document
+      .getElementById("searchInput")
+      .addEventListener("input", handleSearch);
+  });