☰

PT种子列表瀑布流视图(Svelte重构)

PT种子列表无限下拉瀑布流视图(Svelte重构)

当前为 2024-04-01 提交的版本，查看 最新版本。

作者
KesaubeEire
评分
0 0 0
版本
1.1.7
创建于
2023-07-14
更新于
2024-04-01
大小
173.9 KB
许可证
MIT
适用于

为 PT 站点 打造的种子列表瀑布流视图 (现支持 Kame & MT)

gif_preview.gif

预览视频:

https://user-images.githubusercontent.com/20382002/236703818-427840b9-aaee-4133-9185-59244245cb7b.mov

新版 旧版
github 项目地址~ 旧版 github 项目地址~
油猴 项目地址~ 旧版 油猴 项目地址~

简介

RT, 本油猴脚本专为 PT 打造, 让你顺畅划划点点, 一页爽逛种子超市! 欢迎为项目提 issue 以及留言配置您想适配的站点~

相关事宜如果您在 tg 能找到我也可以直接联系我~

使用说明

  1. 注意事项

    1. 建议使用 Chrome 浏览器, 火狐等其他浏览器可能存在不知名问题(from tg by 天 胖)
    2. 不支持 Dark Passion 主题!!! 推荐 blue gene 主题!!!

  2. 本脚本功能:

    1. 对现有的种子列表模式进行增强
      1. 点击图片可以在内部窗口查看种子详情! 不需要新打开表情页了!!!
    2. 支持在已适配的站点将种子列表变为瀑布流视图
    3. 在侧边栏区域可以设置各种配置
      1. 可以拖拽侧边栏位置
      2. 可以切换显示模式: 原表格模式 & 瀑布流模式
      3. 可以呼出详细配置面板配置细节
        (所有配置都能在同一个站点记忆, 不同的站点之间配置不共享)
      4. 如果找不到侧边栏, 页面最下面有 "重置瀑布流配置边栏位置" 的按钮
    4. 鼠标悬浮预览
      1. 鼠标悬浮在卡片非图片区域可以显示种子详细数据内容
      2. 鼠标悬浮在标题区域可以显示标题全称, 默认只显示最多两行
      3. 可以选择整个图片悬浮触发预览或者局部触发预览
      4. 可以调整是否延迟显示大图以防止大图在无意中触发
    5. 点击图片可以在内部窗口查看种子详情! 不需要新打开表情页了!!!
    6. 点击列和列之间的间隙也可以整理布局! 不需要鼠标移到右上角了!!!
    7. 图片懒加载: 对电脑性能和服务器负担都比较小~
    8. 滑动或按钮可以无缝显示下一页的内容, 表格模式 & 瀑布流模式都支持!

  3. 推荐设置:

    1. 如果 PT 站点是 NexusPHP 架构, 推荐将主题改为 Blue Gene
      (一般更改主题方式: 控制面板->网站设定->界面风格)
    2. 某些站点限制网页刷新频率, 所以默认翻页是要点按钮的,
      可以右上手动改为自动检测翻页, 请理解~
TODO LIST - 宏观类 - [ ] (已放弃) 在 readme.md 中把架构图画出来以防屎山(from tg by @兔纸) - 功能类 - [x] 原 table 也随着滑动到底部自动添加数据 (np架构可以) - [ ] TODO: ( 类似index的位置 )显示当前是否下载以及下载进度(from tg by @Charlie Swift) - [ ] TODO: 配置按钮区域可拖动 - [ ] 排序区按钮(from tg by 天 胖) - [ ] 卡片宽度 & 间距宽度 调整 - [ ] 简洁模式 & 详细模式 切换 - [x] TODO: 图片中心眼睛 logo - [x] 跟随预览 & 中间预览 切换(from tg by 天 胖) - [x] 加个 ESC 按钮退出 iframe 显示(from tg by LNN) - [x] Nexus 触摸显示大图放个半秒再显示？避免划过显示一堆不想看的？(from tg by LNN & 龟龟) - [x] 配置一下标题的隐藏(from tg by LNN) - [x] 侧边栏右侧位置保护(from tg by 天 胖) - [x] 将是否打开原有列表记忆在 localstorage 里(from tg by 天 胖) - [x] 给列表模式加点击 iframe 显示详情(from tg by 天 胖) - [x] 配置悬浮预览大图的触发方式: 全图 or 局部 (以改善直接悬浮图片显示大图的体验) (from tg by 兔纸) - [x] Kame - [x] M-Team - [x] TODO: 排列模式:按照列的模式加紧(from tg by 天 胖) 基本搞定了, 想想怎么在UI上整合进去就行, 代码也要改, 下面的不过是伪代码罢了. ```javascript function resizeMasonry(columns,gutter=10) { // 最少两列 if(columns<=1 || gutter<=1) { console.warn('卡片列数或卡片间隔过小, 列数不小于2, 间隔不小于1') return } // 算宽度 const widthContainer = document.querySelector('div.waterfall').clientWidth; const widthCard = (widthContainer - (columns-1)*gutter)/(columns); // 配置宽度 Array.from(document.querySelectorAll('.card')).forEach(el=>el.style.width = widthCard+'px'); masonry.options.columnWidth = widthCard; masonry.options.gutter = gutter ; masonry.layout(); // 往 localstorage 里写列数和间隔 } ``` - 样式类 - [x] iframe 两侧颜色降低亮度(from tg by LNN) - [x] 边栏整体向 bilibili-evolve 看齐(from tg by LNN) - [x] MT卡片分类文字居中(from tg by 天 胖) - [ ] TODO: 将 'new' 'hot' 和 index 一样放在图片上下左右 - [x] (已放弃) 改改阴影, 学习 [如何用 CSS 中写出超级美丽的阴影效果](https://juejin.cn/post/7034323356459466760)(from tg by Kyaru) - [ ] 刚进种子页面会出现蚂蚁线, 考虑改进一下?(from tg by LNN) - [x] 在非瀑布流模式下点击下一页没用, 报错 - 站点指定修改类 - [x] Kame: 给龟站的搜索箱默认设置为"不扩展", 否则平常占地方(from tg by LNN) - [x] Kame: "点此查看即将断种资源" 文字设置为黑色(from tg by LNN) - [x] Kame: 勋章 z-index 较低会被卡片挡住(from tg by bacz) - 说明类 - [ ] github & 油猴介绍 数据脱敏 (from tg by 天 胖) - [ ] 问一下每个站点的管理有没有必要 - [ ] 去除匹配站点的域名展示 - [ ] 去除匹配站点的原始匹配 - NOTE: 对 M-team 新架构的功能计划 - [ ] 瀑布流 - [x] 对 localstorage & URL path 相关参数的完整识别及劫持 - [x] 获取当前所在 path -> 分区 / pageSize 获取下拉请求的 search 参数 - [x] 搞定刷新的 loading - [x] 初始化加载 -> 封装参数转换函数 & localstorage 持久化函数的 文本 & 对象 的本地缓存 - [x] 搞定加载下一页 - [x] 卡片处理 - [x] 获取背景颜色 -> 并封装到所有站点配置项目里 - [x] 图片加载失败 & 无预览图片 svg 缺省图片 -> 已向其他支持的站点推广 - [x] 对 icon 进行 svg 改造 - [x] 将卡片各个部分的显示隐藏配置完整 - [x] 整合 localstorage 条目, 像 newMT 的 localstorage 一样干净 - [ ] 小 bug - [x] 处理 ant-submenu 等 z-index 遮挡问题 - [x] 延时触发 Nexus_Tools, 避免懒加载失效 - [x] 点到非 /browse 页面 loading 依然会出现 - [x] /browse 出来又回来 originTable 出现了 - [x] 详细配置面板样式小问题 - [x] 无动画情况下更改显示条目的卡牌自动整理不起效 - [ ] 对没有加载到的 src 进行预加载(大活儿, 不着急) ```javascript // 图片链接数组 const imageUrls = [ 'https://example.com/image1.jpg', 'https://example.com/image2.jpg', 'https://example.com/image3.jpg', ]; // 创建一个数组来存储预加载的图片 const preloadedImages = []; // 遍历图片链接并预加载它们 imageUrls.forEach((imageUrl) => { const img = new Image(); img.src = imageUrl; // 将预加载的图片对象存储到数组中 preloadedImages.push(img); }); // 可以在需要时使用已经预加载的图片 // 例如，将它们添加到页面上： preloadedImages.forEach((img) => { document.body.appendChild(img); }); ```
旧版历史 TODO LIST - 其他事务 - [x] 将 油猴脚本从成人区撤离, 改为正常 - [x] 将 特别区作为截图示范, 添加 /special.php 的适配 - 功能列表 - [x] 懒加载(from tg by @兔纸) - [x] 懒加载完成后新图片出来之际整理瀑布流 - [x] 修复了一些小的懒加载不出图的小 bug - [x] 触摸图片预览原图(from tg by @兔纸) - [x] 修正右边图片的预览位置 - [x] 抄[某 pixiv 油猴脚本](https://github.com/Ocrosoft/PixivPreviewer)的实现(from tg by @兔纸) 失败了, 有点复杂 - [x] 自己改了改, 基本修正了 - [x] 更好的四空间(四叉树)改造法基本完成, 等待大家反馈意见 - [x] 做一个切换显示方式(尽量原图&最大显示)的切换变化, panel 完成后搞 - [x] 默认将自动翻页改为按键翻页(from tg by @兔纸) - [x] 抄 NGA 的方式下拉到底后触点下一页(from tg by @兔纸) 不太好用捏 - [x] 给滑动翻页加一个防抖, 时间可以久一点 - [x] 瀑布流基础排版 - [x] 滑动到底部刷新页面 - [x] 美化卡片内信息布局 & 样式 - [x] 抄鲨鱼的 UI 样式, Free 的提示什么的(from tg by @兔纸) 用原样了捏 - [x] 基本布局 - [x] 点击整个卡片跳转(from tg by @风言) - [x] 没有完全弄成那样, 会妨碍下载和收藏, 把图片和副标题点击跳网页做了 - [x] 点击卡片不是打开新页面，而是在本页面打开 iframe 直接看内容，看完关掉，都不用切换页面了 - [x] 卡片背景颜色适配主题(from tg by @LNN) - [x] 去掉副标题(from tg by @lslqtz) - [x] 右上角按钮 z-index 置顶(from tg by @lslqtz) - [x] 标签样式改为 div 的多行 flex(from tg by @bacz) - [ ] 将一些参数配置为可变 - [x] 配置 LocalStorage 记录参数捏 - [x] 单列宽度可调整(已 api 实现, 还需要简化操作方式) - [x] UI 化宽度调整 -> 右上角可设置单列 200px / 300px 切换 - [x] 分卡片固定宽度模式和列数固定宽度模式 - [x] 宽度固定模式: 默认模式(废弃) - [x] 列数固定模式: 默认固定列数可调, 不少于 x 列 (from tg by @兔纸) - [ ] 设置详情文字(副标题)和标签左对齐 or 居中(from tg by @阴天) - [x] 配置可以忽略详情只剩标题图片的简略模式 - [x] MT 已适配 - [ ] 花样小 bug - [x] 下载按钮 href - [x] 改为宽列后, 新增的卡片仍然按照原先的列宽生成卡片 - [x] 当下拉页没有新内容时控制台优雅报错 - [x] 缩放小于 95% 时右侧有空隙 -> 不清楚真实的 4K 屏幕会不会有影响, 只能先这样设置边框为 3px - [x] 点击收藏后刷新页面 or 直接更新收藏图标 - [ ] UI 提示 - [x] 标题过长的话半透明背景可能会导致文字与图片重叠 (from tg by @bacz) - [x] 测试网站地址漏了 (from tg by @bacz) - [x] 收藏按钮样式调整 (from tg by @bacz) - [x] 图片链接多此一举了, 直接搬原链即可 (from tg by @Kyaru) - [x] 预览大图片的 bug 基本修完, 可继续改进 - [x] 集成 Masonry.js 到项目, 非常感谢胖哥!!!(from tg by 天 胖) - [x] 让下载和收藏都变成隐藏按钮: 现在下载还不是隐藏按钮 - [ ] ... - [x] 站点状态对齐 - [x] KamePT.js: 最新 - [x] (卡片顶部种类样式待更新) - [x] free 时间被搞到了临时标签里, 取出来 - [x] MTeam.js: 最新 - [x] PTer.js: 最新
记录一些小小的暴论(嘻嘻本人不要打我)

1. 违反用户直觉的都是垃圾程序 by兔纸(2023/05/08 18:39)