koishi-plugin-fimtale-api 0.0.95 → 0.0.98

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 标准)
+  // 渲染配置 (标准手机比例)
   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)")
@@ -61,11 +61,6 @@ function apply(ctx, config) {
     lastCheck: "integer"
   }, { primary: "id", autoInc: true });
   const sleep = /* @__PURE__ */ __name((ms) => new Promise((resolve) => setTimeout(resolve, ms)), "sleep");
-  const formatDate = /* @__PURE__ */ __name((timestamp) => {
-    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");
   const stripHtml = /* @__PURE__ */ __name((html) => {
     if (!html) return "";
     return html.replace(/<[^>]+>/g, "").replace(/&nbsp;/g, " ").replace(/\s+/g, " ").trim();
@@ -85,7 +80,7 @@ function apply(ctx, config) {
     if (!html) return "";
     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 fontStack = '"Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif';
   const fontSerif = '"Noto Serif SC", "Source Han Serif SC", "SimSun", serif';
   const injectCookies = /* @__PURE__ */ __name(async (page) => {
     if (!config.cookies) return;
@@ -101,7 +96,7 @@ function apply(ctx, config) {
       const url = `${config.apiUrl}/t/${threadId}`;
       const params = { APIKey: config.apiKey, APIPass: config.apiPass };
       const res = await ctx.http.get(url, { params });
-      if (res.Status !== 1 || !res.TopicInfo) return { valid: false, msg: res.ErrorMessage || "API 返回错误" };
+      if (res.Status !== 1 || !res.TopicInfo) return { valid: false, msg: res.ErrorMessage || "API Error" };
       return {
         valid: true,
         data: res.TopicInfo,
@@ -109,7 +104,7 @@ function apply(ctx, config) {
         menu: res.Menu || []
       };
     } catch (e) {
-      return { valid: false, msg: "网络请求失败" };
+      return { valid: false, msg: "Request Failed" };
     }
   }, "fetchThread");
   const fetchRandomId = /* @__PURE__ */ __name(async () => {
@@ -149,7 +144,7 @@ function apply(ctx, config) {
           const titleEl = card.querySelector(".card-title");
           if (titleEl) title = titleEl.textContent?.trim() || "";
           else title = link.textContent?.trim() || "";
-          let author = "未知";
+          let author = "Unknown";
           const authorEl = card.querySelector('a[href^="/u/"] span.grey-text');
           if (authorEl) author = authorEl.textContent?.trim() || "";
           let cover = void 0;
@@ -220,7 +215,7 @@ function apply(ctx, config) {
     const bgStyle = displayCover ? `background-image: url('${displayCover}');` : `background: ${generateGradient(displayTitle)};`;
     let summary = stripHtml(info.Content);
     if (summary.length < 10 && parent && isChapter) summary = stripHtml(parent.Content);
-    if (summary.length > 110) summary = summary.substring(0, 110) + "...";
+    if (summary.length > 150) summary = summary.substring(0, 150) + "...";
     if (!summary) summary = "暂无简介";
     const tagsArr = [];
     if (displayTagsObj?.Type) tagsArr.push(displayTagsObj.Type);
@@ -236,39 +231,54 @@ function apply(ctx, config) {
       <style>
         body { margin: 0; padding: 0; font-family: ${fontStack}; background: transparent; }
         .card { width: 620px; height: 360px; background: #fff; border-radius: 16px; box-shadow: 0 10px 30px rgba(0,0,0,0.15); display: flex; overflow: hidden; }
+        
         .cover { width: 220px; height: 100%; ${bgStyle} background-size: cover; background-position: center; position: relative; flex-shrink: 0; }
         .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; flex-shrink: 0; }
+        .info { flex: 1; padding: 24px; display: flex; flex-direction: column; overflow: hidden; position: relative; }
+        
+        .header-group { flex-shrink: 0; margin-bottom: 10px; }
         .title { 
-          font-size: 22px; font-weight: 700; color: #333; line-height: 1.35; 
+          font-size: 22px; font-weight: 700; color: #333; line-height: 1.4; 
           display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; 
+          margin-bottom: 4px;
         }
         .subtitle {
-          font-size: 15px; color: #555; margin-top: 6px; font-weight: 500;
+          font-size: 15px; color: #555; font-weight: 500;
           white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
           padding-left: 10px; border-left: 3px solid #e91e63;
+          margin-top: 4px;
         }
-        .author { font-size: 13px; color: #888; margin-top: 8px; font-weight: 400; }
+        .author { font-size: 13px; color: #888; margin-top: 6px; font-weight: 400; }
         
-        .tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0; max-height: 56px; overflow: hidden; flex-shrink: 0;}
+        .tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; flex-shrink: 0; }
         .tag { background: #eff2f5; color: #5c6b7f; padding: 3px 9px; border-radius: 4px; font-size: 11px; font-weight: 500; }
         .tag-imp { background: #e3f2fd; color: #1565c0; }
         
-        /* 简介区域防截断优化 */
+        /* 修复：使用 Flex 自动填充剩余空间，并增加底部 padding 防止截断 */
         .summary-box {
-          flex: 1; position: relative; margin-top: 4px; overflow: hidden;
+          flex: 1; 
+          position: relative; 
+          overflow: hidden;
+          min-height: 0;
         }
         .summary { 
-            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; /* 底部缓冲 */
+            font-size: 13px; color: #666; line-height: 1.6; 
+            display: -webkit-box; 
+            -webkit-line-clamp: 4; 
+            -webkit-box-orient: vertical; 
+            overflow: hidden; 
+            padding-bottom: 3px; /* 关键修复：防止下行字母（如g,j,p,q,y）被切掉 */
         }
 
-        .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;}
+        .footer { 
+            border-top: 1px solid #eee; 
+            padding-top: 14px; 
+            display: flex; justify-content: space-between; 
+            font-size: 12px; color: #888; 
+            margin-top: auto; /* 确保页脚始终在底部 */
+            flex-shrink: 0;
+        }
         .stat b { color: #555; font-weight: bold; margin-right: 2px;}
       </style>
     </head>
@@ -281,13 +291,8 @@ 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>
@@ -364,76 +369,87 @@ function apply(ctx, config) {
   }, "renderSearchResults");
   const renderReadPages = /* @__PURE__ */ __name(async (info) => {
     const content = cleanContent(info.Content);
+    const headerHeight = 40;
+    const footerHeight = 30;
+    const paddingX = 25;
+    const paddingY = 20;
+    const lineHeightRatio = 1.8;
+    const contentWidth = config.deviceWidth - paddingX * 2;
+    const columnGap = 40;
+    const maxContentHeight = config.deviceHeight - headerHeight - footerHeight;
+    const lineHeightPx = config.fontSize * lineHeightRatio;
+    const linesPerPage = Math.floor((maxContentHeight - paddingY * 2) / lineHeightPx);
+    const optimalContentHeight = linesPerPage * lineHeightPx + paddingY * 2;
+    const marginTop = Math.floor((maxContentHeight - optimalContentHeight) / 2) + headerHeight;
     const html = `
     <!DOCTYPE html>
     <html>
     <head>
       <style>
-        body { margin: 0; padding: 0; width: ${config.deviceWidth}px; background-color: #f6f4ec; color: #2c2c2c; font-family: ${fontSerif}; }
-        #source-container { display: none; }
-        .page {
-          width: ${config.deviceWidth}px; height: ${config.deviceHeight}px;
-          /* 增加 padding，减少每页内容量，看起来更舒适 */
-          padding: 40px 30px; box-sizing: border-box;
-          position: relative; background: #f6f4ec; overflow: hidden;
-          /* 关键：CSS多列布局，无需手动分页 */
-          display: flex; flex-direction: column;
+        body { margin: 0; padding: 0; width: ${config.deviceWidth}px; height: ${config.deviceHeight}px; background-color: #f6f4ec; color: #2c2c2c; font-family: ${fontSerif}; overflow: hidden; position: relative;}
+        
+        .fixed-header {
+           position: absolute; top: 0; left: 0; width: 100%; height: ${headerHeight}px;
+           border-bottom: 1px solid #d7ccc8; box-sizing: border-box;
+           padding: 0 20px; display: flex; align-items: center; justify-content: space-between;
+           font-size: 12px; color: #8d6e63; background: #f6f4ec; z-index: 5; 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; /* 隐藏滚动条 */
+        .fixed-footer {
+           position: absolute; bottom: 0; left: 0; width: 100%; height: ${footerHeight}px;
+           display: flex; align-items: center; justify-content: center;
+           font-size: 12px; color: #aaa; background: #f6f4ec; z-index: 5;
         }
 
-        /* 实际内容区 */
-        .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;
+        /* 视口容器：用于隐藏溢出的页面 */
+        #viewport {
+           position: absolute;
+           top: ${marginTop}px;
+           left: ${paddingX}px; /* 左边距 */
+           width: ${contentWidth}px; /* 限制视口只显示一页内容的宽度 */
+           height: ${optimalContentHeight}px;
+           overflow: hidden; /* 关键：隐藏其他页 */
         }
 
-        /* 固定页眉页脚 (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};
-        }
-        .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};
+        /* 内容长条：实际上是超宽的 */
+        #content-scroller {
+           height: 100%;
+           width: 100%; /* 这里的 100% 是相对于 viewport 的 contentWidth */
+           
+           /* CSS Columns 布局 */
+           column-width: ${contentWidth}px;
+           column-gap: ${columnGap}px;
+           column-fill: auto;
+           
+           padding: ${paddingY}px 0; /* 左右不需要 padding，因为 viewport 已经定了位置 */
+           box-sizing: border-box;
+           
+           font-size: ${config.fontSize}px; 
+           line-height: ${lineHeightRatio}; 
+           text-align: justify;
+           
+           /* 关键：使用 transform 移动，初始位置为 0 */
+           transform: translateX(0);
+           transition: none;
         }
-
-        /* 排版细节 */
+        
         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; }
+        img { max-width: 100%; height: auto; display: block; margin: 10px auto; border-radius: 6px; }
+        h1, h2, h3 { font-size: 1.1em; margin: 0.8em 0; color: #5d4037; text-indent: 0; font-weight: bold; break-after: avoid; break-inside: avoid; }
       </style>
     </head>
     <body>
-      <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 id="viewport">
+        <div id="content-scroller">
+           ${content}
+        </div>
+      </div>
+
       <div class="fixed-footer" id="page-indicator">- 1 -</div>
     </body></html>`;
     const page = await ctx.puppeteer.page();
@@ -441,16 +457,16 @@ function apply(ctx, config) {
       await injectCookies(page);
       await page.setContent(html);
       await page.setViewport({ width: config.deviceWidth, height: config.deviceHeight, deviceScaleFactor: 2 });
-      const scrollWidth = await page.$eval("#content-wrapper", (el) => el.scrollWidth);
-      const totalPages = Math.ceil(scrollWidth / config.deviceWidth);
+      const scrollWidth = await page.$eval("#content-scroller", (el) => el.scrollWidth);
+      const step = contentWidth + columnGap;
+      const totalPages = Math.ceil((scrollWidth + columnGap) / step) || 1;
       const imgs = [];
       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) => {
+        await page.evaluate((idx, stepPx, curr, total) => {
+          const offset = -(idx * stepPx);
+          document.getElementById("content-scroller").style.transform = `translateX(${offset}px)`;
           document.getElementById("page-indicator").innerText = `- ${curr} / ${total} -`;
-        }, i + 1, totalPages);
+        }, i, step, i + 1, totalPages);
         const img = await page.screenshot({ type: "jpeg", quality: 80 });
         imgs.push(img);
       }

package/package.json

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