koishi-plugin-fimtale-api 0.0.8 → 0.0.95

package/lib/index.js

@@ -47,7 +47,7 @@ var Config = import_koishi.Schema.object({
   cookies: import_koishi.Schema.string().role("secret").description("浏览器 Cookie (用于解除安全模式，必填)"),
   pollInterval: import_koishi.Schema.number().default(60 * 1e3).description("追更轮询间隔(ms)"),
   autoParseLink: import_koishi.Schema.boolean().default(true).description("自动解析链接为预览卡片"),
-  // 渲染配置 (iPhone 12/13 Pro 比例)
+  // 渲染配置 (iPhone 12/13 标准)
   deviceWidth: import_koishi.Schema.number().default(390).description("阅读器渲染宽度(px)"),
   deviceHeight: import_koishi.Schema.number().default(844).description("阅读器渲染高度(px)"),
   fontSize: import_koishi.Schema.number().default(20).description("正文字号(px)")
@@ -62,7 +62,7 @@ function apply(ctx, config) {
   }, { primary: "id", autoInc: true });
   const sleep = /* @__PURE__ */ __name((ms) => new Promise((resolve) => setTimeout(resolve, ms)), "sleep");
   const formatDate = /* @__PURE__ */ __name((timestamp) => {
-    if (!timestamp) return "未知日期";
+    if (!timestamp) return "Unknown";
     const date = new Date(timestamp * 1e3);
     return `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, "0")}-${date.getDate().toString().padStart(2, "0")}`;
   }, "formatDate");
@@ -83,9 +83,10 @@ function apply(ctx, config) {
   }, "generateGradient");
   const cleanContent = /* @__PURE__ */ __name((html) => {
     if (!html) return "";
-    return html.replace(/<p>\s*&nbsp;\s*<\/p>/gi, "").replace(/<p>\s*<br\s*\/?>\s*<\/p>/gi, "").replace(/<p>\s*<\/p>/gi, "").replace(/(<br\s*\/?>){2,}/gi, "<br>").replace(/margin-bottom:\s*\d+px/gi, "");
+    return html.replace(/style="[^"]*"/gi, "").replace(/<p[^>]*>\s*(&nbsp;|<br\s*\/?>|\s)*\s*<\/p>/gi, "").replace(/(<br\s*\/?>\s*){2,}/gi, "<br>").trim();
   }, "cleanContent");
   const fontStack = '"Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", "WenQuanYi Micro Hei", Arial, sans-serif';
+  const fontSerif = '"Noto Serif SC", "Source Han Serif SC", "SimSun", serif';
   const injectCookies = /* @__PURE__ */ __name(async (page) => {
     if (!config.cookies) return;
     const cookies = config.cookies.split(";").map((pair) => {
@@ -239,7 +240,7 @@ function apply(ctx, config) {
         .id-tag { position: absolute; top: 12px; left: 12px; background: rgba(0,0,0,0.6); color: #fff; padding: 4px 10px; border-radius: 6px; font-size: 13px; font-weight: bold; backdrop-filter: blur(4px); font-family: monospace; }
         .info { flex: 1; padding: 24px; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; }
         
-        .header-group { display: flex; flex-direction: column; }
+        .header-group { display: flex; flex-direction: column; flex-shrink: 0; }
         .title { 
           font-size: 22px; font-weight: 700; color: #333; line-height: 1.35; 
           display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; 
@@ -255,13 +256,16 @@ function apply(ctx, config) {
         .tag { background: #eff2f5; color: #5c6b7f; padding: 3px 9px; border-radius: 4px; font-size: 11px; font-weight: 500; }
         .tag-imp { background: #e3f2fd; color: #1565c0; }
         
+        /* 简介区域防截断优化 */
         .summary-box {
-          flex: 1; overflow: hidden; position: relative; margin-top: 8px;
+          flex: 1; position: relative; margin-top: 4px; overflow: hidden;
         }
         .summary { 
-            font-size: 13px; color: #666; line-height: 1.6; 
-            max-height: 6.4em; 
+            font-size: 13px; color: #666; 
+            line-height: 1.5; /* 设定标准行高 */
+            max-height: 6em;  /* 4行 = 1.5 * 4 */
             display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; 
+            padding-bottom: 2px; /* 底部缓冲 */
         }
 
         .footer { border-top: 1px solid #eee; padding-top: 14px; display: flex; justify-content: space-between; font-size: 12px; color: #888; margin-top: 15px; flex-shrink: 0;}
@@ -277,8 +281,13 @@ function apply(ctx, config) {
             ${subTitle ? `<div class="subtitle">${subTitle}</div>` : ""}
             <div class="author">@${info.UserName}</div>
           </div>
+          
           <div class="tags">${displayTags.map((t) => `<span class="tag ${["文", "译", "R"].includes(t) ? "tag-imp" : ""}">${t}</span>`).join("")}</div>
-          <div class="summary-box"><div class="summary">${summary}</div></div>
+          
+          <div class="summary-box">
+            <div class="summary">${summary}</div>
+          </div>
+
           <div class="footer">
             <span class="stat"><b style="color:#009688">热度</b>${views}</span>
             <span class="stat"><b style="color:#673ab7">评论</b>${comments}</span>
@@ -360,104 +369,90 @@ function apply(ctx, config) {
     <html>
     <head>
       <style>
-        body { margin: 0; padding: 0; width: ${config.deviceWidth}px; background-color: #f6f4ec; color: #2c2c2c; font-family: ${fontStack}; }
+        body { margin: 0; padding: 0; width: ${config.deviceWidth}px; background-color: #f6f4ec; color: #2c2c2c; font-family: ${fontSerif}; }
         #source-container { display: none; }
-        
-        /* 使用 Flex 布局，让页脚自然占据底部空间，不覆盖正文 */
         .page {
           width: ${config.deviceWidth}px; height: ${config.deviceHeight}px;
-          padding: 35px 28px; box-sizing: border-box;
+          /* 增加 padding，减少每页内容量，看起来更舒适 */
+          padding: 40px 30px; box-sizing: border-box;
           position: relative; background: #f6f4ec; overflow: hidden;
+          /* 关键：CSS多列布局，无需手动分页 */
           display: flex; flex-direction: column;
         }
         
-        .page-header { 
-          font-size: 12px; color: #8d6e63; border-bottom: 2px solid #d7ccc8; 
-          padding-bottom: 12px; margin-bottom: 15px; flex-shrink: 0;
-          display: flex; justify-content: space-between; font-weight: bold;
+        /* 自定义 CSS Column 容器 */
+        #content-wrapper {
+            width: ${config.deviceWidth}px; height: ${config.deviceHeight}px;
+            column-width: ${config.deviceWidth}px; column-gap: 0; column-fill: auto;
+            overflow-x: hidden; overflow-y: hidden; /* 隐藏滚动条 */
         }
-        
-        /* 页脚改为相对定位，并给予上边距 */
-        .page-footer {
-          text-align: center; font-size: 12px; color: #aaa; font-family: sans-serif;
-          flex-shrink: 0; padding-top: 10px; margin-top: auto; 
+
+        /* 实际内容区 */
+        .inner-content {
+            padding: 50px 25px 40px 25px; /* 避让页眉页脚 */
+            box-sizing: border-box;
+            height: 100%;
+            font-size: ${config.fontSize}px; 
+            line-height: 1.8; 
+            text-align: justify;
         }
-        
-        .page-content { 
-          flex: 1; /* 占据剩余所有空间 */
-          overflow: hidden; /* 隐藏溢出部分 */
-          font-size: ${config.fontSize}px; 
-          line-height: 1.7; 
-          text-align: justify; 
+
+        /* 固定页眉页脚 (Overlay) */
+        .fixed-header {
+            position: absolute; top: 0; left: 0; width: 100%; height: 40px;
+            background: #f6f4ec; z-index: 10;
+            border-bottom: 1px solid #d7ccc8;
+            display: flex; align-items: center; justify-content: space-between;
+            padding: 0 25px; box-sizing: border-box;
+            font-size: 12px; color: #8d6e63; font-weight: bold; font-family: ${fontStack};
         }
-        
-        p { margin: 0 0 0.6em 0; text-indent: 2em; }
-        img { max-width: 100%; height: auto; display: block; margin: 10px auto; border-radius: 6px; box-shadow: 0 4px 10px rgba(0,0,0,0.1); }
-        h1, h2, h3 { font-size: 1.1em; margin: 0.5em 0; color: #5d4037; text-indent: 0; font-weight: bold; }
+        .fixed-footer {
+            position: absolute; bottom: 0; left: 0; width: 100%; height: 30px;
+            background: #f6f4ec; z-index: 10;
+            display: flex; align-items: center; justify-content: center;
+            font-size: 12px; color: #aaa; font-family: ${fontStack};
+        }
+
+        /* 排版细节 */
+        p { margin: 0 0 0.8em 0; text-indent: 2em; }
+        img { max-width: 100%; height: auto; display: block; margin: 15px auto; border-radius: 6px; box-shadow: 0 4px 10px rgba(0,0,0,0.1); break-inside: avoid; }
+        h1, h2, h3 { font-size: 1.1em; margin: 0.8em 0; color: #5d4037; text-indent: 0; font-weight: bold; break-after: avoid; }
       </style>
     </head>
     <body>
-      <div id="source-container"><div class="meta-info" data-title="${info.Title}" data-author="${info.UserName}"></div>${content}</div>
-      <div id="output"></div>
-      <script>
-        function paginate() {
-          const source = document.getElementById('source-container');
-          const output = document.getElementById('output');
-          const title = source.querySelector('.meta-info').dataset.title;
-          const author = source.querySelector('.meta-info').dataset.author;
-          let pageIndex = 1;
-          let currentPageContent = null;
-          
-          function createNewPage() {
-            const page = document.createElement('div'); page.className = 'page';
-            const header = document.createElement('div'); header.className = 'page-header';
-            header.innerHTML = \`<span>\${title.substring(0, 12) + (title.length>12?'...':'')}</span><span>\${author}</span>\`;
-            page.appendChild(header);
-            
-            const content = document.createElement('div'); content.className = 'page-content';
-            page.appendChild(content);
-            
-            const footer = document.createElement('div'); footer.className = 'page-footer';
-            footer.id = 'footer-' + pageIndex;
-            page.appendChild(footer);
-            
-            output.appendChild(page);
-            currentPageContent = content;
-            return page;
-          }
-          
-          createNewPage();
-          const children = Array.from(source.children);
-          
-          for (const child of children) {
-            if (child.className === 'meta-info') continue;
-            
-            currentPageContent.appendChild(child.cloneNode(true));
-            
-            // 核心修复：增加 10px 的安全缓冲，防止 descenders 被切
-            if (currentPageContent.scrollHeight > currentPageContent.clientHeight - 10) {
-              currentPageContent.removeChild(currentPageContent.lastChild);
-              pageIndex++;
-              createNewPage();
-              currentPageContent.appendChild(child.cloneNode(true));
-            }
-          }
-          
-          for(let i=1; i<=pageIndex; i++) document.getElementById('footer-'+i).innerText = \`- \${i} / \${pageIndex} -\`;
-          return pageIndex;
-        }
-      </script>
+      <div id="source-container"></div>
+      
+      <!-- 使用 CSS Columns 进行分页布局 -->
+      <div id="content-wrapper">
+         <div class="inner-content">
+            ${content}
+         </div>
+      </div>
+
+      <!-- 覆盖层：页眉页脚，截图时通过 JS 更新 -->
+      <div class="fixed-header">
+         <span>${info.Title.substring(0, 12) + (info.Title.length > 12 ? "..." : "")}</span>
+         <span>${info.UserName}</span>
+      </div>
+      <div class="fixed-footer" id="page-indicator">- 1 -</div>
     </body></html>`;
     const page = await ctx.puppeteer.page();
     try {
       await injectCookies(page);
       await page.setContent(html);
       await page.setViewport({ width: config.deviceWidth, height: config.deviceHeight, deviceScaleFactor: 2 });
-      await page.evaluate("paginate()");
+      const scrollWidth = await page.$eval("#content-wrapper", (el) => el.scrollWidth);
+      const totalPages = Math.ceil(scrollWidth / config.deviceWidth);
       const imgs = [];
-      const pages = await page.$$(".page");
-      for (const p of pages) {
-        imgs.push(await p.screenshot({ type: "jpeg", quality: 80 }));
+      for (let i = 0; i < totalPages; i++) {
+        await page.evaluate((x) => {
+          document.getElementById("content-wrapper").scrollTo(x, 0);
+        }, i * config.deviceWidth);
+        await page.evaluate((curr, total) => {
+          document.getElementById("page-indicator").innerText = `- ${curr} / ${total} -`;
+        }, i + 1, totalPages);
+        const img = await page.screenshot({ type: "jpeg", quality: 80 });
+        imgs.push(img);
       }
       return imgs;
     } finally {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "koishi-plugin-fimtale-api",
   "description": "Koishi插件，从fimtale搜索/订阅/随机获取小说/解析链接等",
-  "version": "0.0.8",
+  "version": "0.0.95",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
   "files": [