feat: add Cloudflare Pages HTML frontend by Copilot · Pull Request #4 · XMOJ-Script-dev/ELXMOJ

Copilot · 2026-03-22T03:43:43Z

Static landing page for ELXMOJ deployable to Cloudflare Pages with no build step required.

`docs/index.html`

Single self-contained file — no dependencies, no build tooling.

Nav — sticky, frosted-glass, smooth-scroll to all sections
Hero — tagline + "立即下载" / "查看源码" CTAs
Features — 6-card grid covering userscript injection, update detection, dual channels (stable/preview), settings persistence, cross-platform, self-check
Download — fetches releases/latest from GitHub API at runtime; renders per-OS cards (Windows/macOS/Linux) with filename + size; falls back to a GitHub Releases link on API failure
How it works — 3-step guide
Footer — GitHub, Releases, issues, XMOJ, license

Design matches the existing green palette (#0a7a4f) from src/settings.html.

`docs/_headers`

Cloudflare Pages security headers applied to /*:

X-Frame-Options: DENY
X-Content-Type-Options: nosniff
Referrer-Policy: strict-origin-when-cross-origin
Permissions-Policy: geolocation=(), camera=(), microphone=()

Deploy

In the Cloudflare Pages dashboard set Build output directory to docs; leave build command empty.

📍 Connect Copilot coding agent with Jira, Azure Boards or Linear to delegate work to Copilot in one click without leaving your project management tool.

Co-authored-by: PythonSmall-Q <106425289+PythonSmall-Q@users.noreply.github.com> Agent-Logs-Url: https://github.com/XMOJ-Script-dev/ELXMOJ/sessions/64320354-8da8-471e-b22d-04461a839d1e

Copilot

Pull request overview

Adds a static, no-build landing page under docs/ intended for deployment to Cloudflare Pages, including runtime GitHub Releases fetching and baseline security headers.

Changes:

Added a self-contained docs/index.html landing page (hero/features/download/how/footer) with runtime download rendering via GitHub Releases API.
Added Cloudflare Pages _headers to apply basic security headers site-wide.

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 6 comments.

File	Description
docs/index.html	New static landing page with styling + JS that fetches and renders latest release download assets.
docs/_headers	Cloudflare Pages security headers applied to all routes.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot · 2026-03-22T03:52:20Z

docs/index.html

+              const links = assets.map(a => `
+                <a class="dl-link" href="${a.browser_download_url}" target="_blank" rel="noopener">
+                  <span class="dl-name">${formatLabel(a.name)}</span>
+                  <span class="dl-size">${formatBytes(a.size)}</span>


The download cards are constructed with template literals and injected via innerHTML, interpolating asset.name / browser_download_url from the GitHub API. This makes the page vulnerable to DOM XSS if any of those fields contain unexpected HTML (even if unlikely). Prefer building DOM nodes and setting textContent/href attributes, or at minimum HTML-escape interpolated text before assigning to innerHTML.

Copilot · 2026-03-22T03:52:20Z

docs/index.html

+            const date = isNaN(rawDate.getTime())
+              ? release.published_at || ""
+              : rawDate.toLocaleDateString("zh-CN", { year: "numeric", month: "long", day: "numeric" });
+            versionTag.innerHTML = `最新版本：<a href="${release.html_url}" target="_blank" rel="noopener">${release.tag_name}</a> · 发布于 ${date}`;


versionTag.innerHTML = ... interpolates release.tag_name and release.html_url from the GitHub API into HTML. To avoid potential DOM XSS and malformed markup, set textContent for the tag name/date and set the anchor href via DOM APIs instead of using innerHTML.

Suggested change

versionTag.innerHTML = `最新版本：<a href="${release.html_url}" target="_blank" rel="noopener">${release.tag_name}</a> · 发布于 ${date}`;

versionTag.textContent = "最新版本：";

const versionLink = document.createElement("a");

versionLink.href = release.html_url || RELEASES_PAGE;

versionLink.target = "_blank";

versionLink.rel = "noopener";

versionLink.textContent = release.tag_name || "";

versionTag.appendChild(versionLink);

if (date) {

versionTag.appendChild(document.createTextNode(" · 发布于 " + date));

}

Copilot · 2026-03-22T03:52:21Z

docs/index.html

+            const rawDate = new Date(release.published_at);
+            const date = isNaN(rawDate.getTime())
+              ? release.published_at || ""
+              : rawDate.toLocaleDateString("zh-CN", { year: "numeric", month: "long", day: "numeric" });


new Date(release.published_at) will produce a valid date (epoch 1970-01-01) when published_at is null/missing (e.g., certain API edge cases), so the isNaN check won't catch it and the UI would show an incorrect publish date. Consider explicitly checking release.published_at truthiness before formatting, and fall back to an empty string or "未知" when absent.

Suggested change

const rawDate = new Date(release.published_at);

const date = isNaN(rawDate.getTime())

? release.published_at || ""

: rawDate.toLocaleDateString("zh-CN", { year: "numeric", month: "long", day: "numeric" });

let date = "未知";

if (release.published_at) {

const rawDate = new Date(release.published_at);

date = isNaN(rawDate.getTime())

? release.published_at

: rawDate.toLocaleDateString("zh-CN", { year: "numeric", month: "long", day: "numeric" });

}

Copilot · 2026-03-22T03:52:21Z

docs/index.html

+      /* ── RESPONSIVE ──────────────────────────────── */
+      @media (max-width: 600px) {
+        nav .nav-links {
+          display: none;


On small screens (max-width: 600px) the primary nav links are set to display: none, which removes in-page navigation for mobile users (and for screen readers at that breakpoint). Consider replacing this with a collapsible menu or a horizontally scrollable nav instead of hiding the links entirely.

Suggested change

display: none;

overflow-x: auto;

white-space: nowrap;

Copilot · 2026-03-22T03:52:21Z

docs/index.html

+    <meta property="og:title" content="ELXMOJ — XMOJ 桌面端" />
+    <meta property="og:description" content="ELXMOJ 是一款基于 Electron 的 XMOJ 桌面客户端，自动注入 XMOJ-Script，支持脚本自动更新、设置持久化。" />
+    <meta property="og:type" content="website" />
+    <link rel="icon" type="image/x-icon" href="favicon.ico" />


<link rel="icon" ... href="favicon.ico" /> will 404 when deploying with Cloudflare Pages output directory set to docs because docs/ currently doesn't include favicon.ico (it's at repo root). Either copy the icon into docs/ or change the href to a path that will exist in the deployed site.

Suggested change

<link rel="icon" type="image/x-icon" href="favicon.ico" />

<link rel="icon" type="image/x-icon" href="/favicon.ico" />

Copilot · 2026-03-22T03:52:21Z

docs/index.html

+          if (n.includes("win")) return { os: "win",   label: "Windows" };
+          if (n.includes("mac") || n.includes("darwin")) return { os: "mac", label: "macOS"   };


classifyAsset() checks n.includes("win") before checking for "darwin". Asset names containing "darwin" (common for mac builds) will match the "win" branch and be misclassified as Windows. Reorder the checks (mac/darwin before win) or use stricter matching to avoid substring collisions.

Suggested change

if (n.includes("win")) return { os: "win", label: "Windows" };

if (n.includes("mac") || n.includes("darwin")) return { os: "mac", label: "macOS" };

if (n.includes("mac") || n.includes("darwin")) return { os: "mac", label: "macOS" };

if (n.includes("win")) return { os: "win", label: "Windows" };

Initial plan

0b1dd7a

Copilot AI assigned Copilot and PythonSmall-Q Mar 22, 2026

Copilot started work on behalf of PythonSmall-Q March 22, 2026 03:43 View session

pull-request-size bot added the size/XS label Mar 22, 2026

feat: add HTML frontend for Cloudflare Pages deployment

6303ee8

Co-authored-by: PythonSmall-Q <106425289+PythonSmall-Q@users.noreply.github.com> Agent-Logs-Url: https://github.com/XMOJ-Script-dev/ELXMOJ/sessions/64320354-8da8-471e-b22d-04461a839d1e

pull-request-size bot added size/XL and removed size/XS labels Mar 22, 2026

Copilot AI changed the title ~~[WIP] Add HTML frontend for deployment to Cloudflare Pages~~ feat: add Cloudflare Pages HTML frontend Mar 22, 2026

Copilot AI requested a review from PythonSmall-Q March 22, 2026 03:48

Copilot finished work on behalf of PythonSmall-Q March 22, 2026 03:48

PythonSmall-Q approved these changes Mar 22, 2026

View reviewed changes

PythonSmall-Q marked this pull request as ready for review March 22, 2026 03:49

Copilot AI review requested due to automatic review settings March 22, 2026 03:49

Copilot started reviewing on behalf of PythonSmall-Q March 22, 2026 03:49 View session

PythonSmall-Q merged commit a808d48 into master Mar 22, 2026
5 checks passed

PythonSmall-Q deleted the copilot/create-html-frontend branch March 22, 2026 03:50

Copilot AI reviewed Mar 22, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: add Cloudflare Pages HTML frontend#4

feat: add Cloudflare Pages HTML frontend#4
PythonSmall-Q merged 2 commits intomasterfrom
copilot/create-html-frontend

Copilot AI commented Mar 22, 2026 •

edited

Loading

Uh oh!

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI Mar 22, 2026

Uh oh!

Copilot AI Mar 22, 2026

Uh oh!

Copilot AI Mar 22, 2026

Uh oh!

Copilot AI Mar 22, 2026

Uh oh!

Copilot AI Mar 22, 2026

Uh oh!

Copilot AI Mar 22, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

-            versionTag.innerHTML = `最新版本：<a href="${release.html_url}" target="_blank" rel="noopener">${release.tag_name}</a> · 发布于 ${date}`;
+            versionTag.textContent = "最新版本：";
+            const versionLink = document.createElement("a");
+            versionLink.href = release.html_url || RELEASES_PAGE;
+            versionLink.target = "_blank";
+            versionLink.rel = "noopener";
+            versionLink.textContent = release.tag_name || "";
+            versionTag.appendChild(versionLink);
+            if (date) {
+              versionTag.appendChild(document.createTextNode(" · 发布于 " + date));
+            }

	<link rel="icon" type="image/x-icon" href="favicon.ico" />
	<link rel="icon" type="image/x-icon" href="/favicon.ico" />

		if (n.includes("win")) return { os: "win", label: "Windows" };
		if (n.includes("mac") \|\| n.includes("darwin")) return { os: "mac", label: "macOS" };

Conversation

Copilot AI commented Mar 22, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

docs/index.html

docs/_headers

Deploy

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Copilot AI Mar 22, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 22, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 22, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 22, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 22, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 22, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Copilot AI commented Mar 22, 2026 •

edited

Loading

`docs/index.html`

`docs/_headers`