feat: 集成漫画源并支持在线阅读

2026-08-08 19:32:47 +08:00
parent c2292da442
commit 87dcc307e6
30 changed files with 3681 additions and 58 deletions
@@ -0,0 +1,61 @@
+<!doctype html>
+<html lang="zh-CN" data-ui-theme="dark">
+<head>
+  <meta charset="UTF-8" />
+  <meta http-equiv="Content-Security-Policy" content="default-src 'self'; img-src 'self' blob: data:; style-src 'self'; script-src 'self'" />
+  <title>在线漫画</title>
+  <link rel="stylesheet" href="manga-online.css" />
+</head>
+<body>
+  <header class="titlebar">
+    <div class="brand">
+      <img class="brand-logo brand-logo-dark" src="../../icons/dist/dark/icon-32.png" alt="" />
+      <img class="brand-logo brand-logo-light" src="../../icons/dist/light/icon-32.png" alt="" />
+      <span>在线漫画</span>
+      <span id="bookTitle" class="brand-sub">正在打开…</span>
+    </div>
+    <div class="titlebar-spacer"></div>
+    <div class="titlebar-controls">
+      <button id="themeBtn" class="win-btn" title="切换主题" aria-label="切换主题">◐</button>
+      <button id="minBtn" class="win-btn" title="最小化">─</button>
+      <button id="maxBtn" class="win-btn" title="最大化">□</button>
+      <button id="closeBtn" class="win-btn win-close" title="关闭">×</button>
+    </div>
+  </header>
+
+  <div class="toolbar">
+    <button id="tocToggleBtn" class="tool-btn">目录</button>
+    <button id="prevChapterBtn" class="tool-btn">上一章</button>
+    <span id="chapterTitle" class="chapter-title">尚未加载章节</span>
+    <button id="nextChapterBtn" class="tool-btn">下一章</button>
+    <label class="width-control">
+      页面宽度
+      <input id="pageWidthRange" type="range" min="480" max="1400" step="40" value="900" />
+      <span id="pageWidthLabel">900px</span>
+    </label>
+    <span id="qualityLabel" class="quality-label"></span>
+  </div>
+
+  <div class="reader-layout">
+    <aside id="tocPane" class="toc-pane">
+      <div class="toc-head">
+        <div>
+          <strong id="tocTitle">章节目录</strong>
+          <div id="tocMeta" class="toc-meta"></div>
+        </div>
+        <button id="tocCloseBtn" class="icon-btn" title="收起目录">×</button>
+      </div>
+      <div id="chapterList" class="chapter-list"></div>
+      <button id="loadMoreBtn" class="load-more hidden">加载更多章节</button>
+    </aside>
+
+    <main id="pageScroller" class="page-scroller">
+      <div id="readerStatus" class="reader-status">正在读取漫画信息…</div>
+      <div id="pageStack" class="page-stack"></div>
+      <button id="chapterEndNextBtn" class="chapter-end hidden">继续阅读下一章</button>
+    </main>
+  </div>
+
+  <script src="manga-online.js"></script>
+</body>
+</html>