InfinityTime · 无限时光

一款面向 Typecho 的纯图片分享方案。上传一张图，自动得到 WebP 全图 + 缩略图并读取 EXIF；前台是无限瀑布流图片墙 + 灯箱，灯箱侧栏展示拍摄参数；360° 全景图在灯箱内直接可拖拽/缩放浏览；后台可视化配置一切，且所有操作均已 AJAX，不整页刷新。

主题 InfinityTime 负责展示，插件 InfinityTime 负责处理。只需安装这两部分，无需改动任何 Typecho 原生文件。

v1.12.0 重点：主题内联 JS 外置（assets/js/lightbox.js，index.php 从约 1100 行降到约 350 行）+ 后台图集按需 AJAX 加载。v1.11.0 起已含：响应式图片 + AVIF（1600px 中间尺寸、两档 AVIF、srcset/<picture>）与 schema 版本化迁移。v1.10.0 起已含：后台面板重做（现代卡片 + 标签页、拖拽上传与进度、图片拖拽排序、图集局部刷新、维护断点续跑与并发锁）与 CSRF / HTML 清洗 / 上传前置校验。v1.9.0 起已含：灯箱切换体验重做、移动端底部切图按钮与抽屉常驻、桌面端标题移入 EXIF 面板、全景视窗移动端 4:3 / 桌面 16:9。v1.8.3 起已含：同/异比例切换动画统一、健壮性与 XSS 加固。v1.8.1 起已含：全景缩略图 16:9 中央裁切、README 完整开源致谢。v1.8.0 起已含：RGB 直方图、死代码清理。v1.7.4 起已含：主题色提取（3 色 + 大写色号）、CSS 列瀑布流、移动端 Safari 隐藏元素全屏。

功能特性

v1.13.4 更新

• 修复嵌套 HTML 白名单及实体编码链接的过滤漏洞；历史关于内容和联系方式在输出时再次校验。
• 恢复上传预览和内存回收，拖拽排序后的实际提交顺序与预览一致，不再依赖 DataTransfer 是否可用。
• 修复保存站点信息误删当前头像、默认上传失败触发返回类型错误。
• 普通图和全景图重建参数独立，孤儿清理保留仍在引用的 AVIF / 小尺寸 WebP。
• 图片排序和删除同步更新文章地址及元数据；历史无仓库记录的图集不会被重建清空。
• 前台初始化脚本外置，配合部署文档中的严格 CSP；新增安全过滤、仓库行为、后台上传及主题输出回归测试并纳入 CI。

图片处理（后端核心）

• 上传即转 WebP：拦截 Typecho 上传钩子，自动生成全尺寸 WebP 与缩略图。
• 响应式 + AVIF：额外生成 1600px 中间尺寸与两档 AVIF；前台灯箱用 srcset / <picture> 按屏幕与格式选择，手机与支持 AVIF 的浏览器更省流量。
• 上传可靠：后台 AJAX 上传（XMLHttpRequest + FormData），文件和每图标题/描述按预览队列顺序提交，兼容无 DataTransfer 的浏览器；发布图集不整页刷新，失败原因明确提示。
• 质量 / 尺寸可调：WebP 质量、缩略图最长边、普通图宽度上限、普通图质量、全景图宽度、全景图质量 均可配置（滑块/输入框），附「恢复默认最佳设置」（默认值集中定义）。
• 全景自动识别：宽高比 ≈ 2:1（1.98~2.02） 自动判定为 360 全景，无需手动勾选；上传/重建时全景用独立宽度（默认 0=不裁剪）与独立质量（默认 92，比普通全图更高），保证 360 浏览清晰。
• 超大图内存自适应：按像素数动态放宽 memory_limit（8K/8192×4096 全景也能正常转码，峰值约 260MB），避免 GD 编码 WebP 内存溢出。
• 分目录存储：usr/uploads/original/ full/ thumb/，可保留原始文件。
• 权限自愈：写入前校验目录可写，能修复时自动 chmod；仍不可写时给出具体目录与修复命令。
• 错误可见：入库/重建失败原因（目录 / 写入 / 解码 / 缺原图）直接显示，不再笼统报错。
• 单图 60MP 上限保护：超大图给出明确提示，避免内存溢出。
• EXIF 读取：相机、ISO、光圈、快门、焦距、闪光、拍摄时间（中文）、lens、GPS / 方向。
• HEIC / HEIF / AVIF：自动探测 Imagick / ImageMagick / heif-convert，失败自动回退，非标准路径可在后台指定。
• 批量维护：重建缩略图/全图（AJAX 进度，套用全景专属宽度/质量，缺原图计失败）、清理孤儿文件、重建尺寸字段（为历史图集补齐宽高）、清理非插件文章。

首页与展示（前台体验）

• 无限瀑布流：JS 把图片卡按响应式列数分配到弹性列、首行顶对齐；滚动到底自动加载下一页（index.php/page/N），无分页页码。
• 顺序稳定：缩略图按真实宽高 aspect-ratio 预占位，图片懒加载后不再导致列重排、顺序跳变；无限加载的新卡片同样生效。
• 懒加载：原生 loading="lazy" + 滚动检测按需加载。
• 统一边距与圆角：14px 间距、10px 圆角。
• 悬浮底栏：居中圆角胶囊；点击左侧站点信息打开「关于」面板，右侧全屏按钮。
• 灯箱大图：poptrox 单实例；PC / 移动端统一用底部上一张 / 下一张按钮；渐进加载 blur-up（缩略图垫底、原图解码后柔和淡入）；宽幅自动收缩为 EXIF 侧栏让位；多图图集内切换。
• 柔和非线性动效：灯箱淡入淡出、EXIF 侧栏出现/消失、主图 blur-up 均采用柔和缓动（easeInOutQuad / cubic-bezier(0.45,0,0.55,1)），不生硬。
• 全景 360° 浏览：灯箱内当前图若是全景，自动用 Pannellum 渲染可拖拽旋转/滚轮缩放；视窗比例移动端 4:3、桌面端 16:9；拖拽松手（含在视窗外松手）不会误关闭；非全景保持普通图片；切换/关闭自动销毁；Pannellum 本地内置、不依赖 CDN。
• 全景全屏 + 角标：全景图灯箱右上角有**「全屏」按钮**，全屏后变**「退出全屏」；全景卡片右上角带「全景」角标**，一眼区分。
• EXIF 侧栏：主图外侧显示标题 / 描述 / 拍摄参数 / 地址，随图片联动。
• EXIF 侧栏动效：出现/消失为非线性缓动 + 轻微上浮，与灯箱开合风格一致。
• 关于面板：标题固定「关于」、页脚 InfinityTime Theme 链接、打开遮罩调淡（不再像占满屏黑幕）。

后台配置（现代卡片 + 标签页，全部 AJAX）

• 标签页导航：上传发布 / 已发布图集 / 站点信息 / 联系方式 / 转换设置 / 维护，长表单不再一屏滚到底。
• 上传并发布图集：支持拖拽上传与多选，实时预览、逐张标题/描述、拖拽排序、上传进度；AJAX 发布，成功后图集列表局部刷新并清空表单。
• 已发布图集：折叠展示（缩略图 lazy 加载）；展开可编辑图集信息、每图标题/描述/地址、拖拽调整图片顺序、逐张删除、删除整组（均 AJAX）。
• 站点信息 / 关于：头像（支持直接上传，自动转 WebP、独立宽度、自动清理旧图）、站点名称、说明、关于介绍（保存前做 HTML 清洗）。
• 联系方式 / 联系我：可视化选图标、增删/启停（AJAX）。
• WebP 转换设置：按 通用保留原图 / 缩略图 / 普通图 / 全景图 分组；宽度、质量滑块；转换工具状态；「恢复默认最佳设置」（AJAX）。
• 维护：重建缩略图/全图、清理孤儿文件、重建尺寸字段、清理非插件文章；进度实时刷新，刷新页面后可继续未完成任务，并带并发锁。
• 安全加固：写操作带 CSRF token（含 GET 维护任务）、上传单文件大小/像素前置校验、「关于」HTML 危险标签/事件/协议清洗。

技术栈

开发验证

在仓库根目录运行（测试环境使用 PHP 8.2+、DOM 扩展和 Node.js 20+）：

php tests/test.php
php tests/sanitizer-fallback.php
php tests/repository.php
php tests/upload-fallback.php
php tests/theme-output.php
node tests/admin-upload.cjs

CI 同时检查 PHP / JS 语法、版本一致性和更新记录。仓库测试使用隔离临时文件及 DB/编码器替身；后台脚本测试模拟 DOM，覆盖预览、拖拽、移除和无 DataTransfer 时的提交顺序。这些检查不能替代真实 Typecho 后台及图片编码器的端到端验证。

后端

• PHP ≥ 7.4（推荐 8.x）+ Typecho 1.3；php-gd（WebP/缩放）、php-exif、可选 php-imagick / ImageMagick / heif-convert。
• 存储：独立表 typecho_infinitytime_images（兼容 MySQL / SQLite / PostgreSQL），图集复用 Typecho contents + fields。
• 配置：插件 options + 主题 pp_opt()；默认值统一为插件常量。

前端

• 原生 HTML/CSS/JS + jQuery；瀑布流、无限滚动、灯箱均原生实现。
• 灯箱：poptrox 二次封装；全景：Pannellum（本地内置 assets/js/pannellum.js + assets/css/pannellum.css）。
• 同步：MutationObserver + 轻量轮询；图标本地 iconfont，不依赖 CDN。

安装

方式一：直接放入 Typecho

把仓库两份目录拷到 Typecho 站点：

usr/themes/InfinityTime/     # 主题
usr/plugins/InfinityTime/    # 插件

或用 GitHub Release 里的 infinitytime-theme.zip / infinitytime-plugin.zip，解压后分别放入对应目录。

启用

1. 后台 设置 → 插件，启用 InfinityTime（自动建表、自检上传目录、注册菜单）。
2. 后台 外观 → 主题，启用 InfinityTime。
3. 进入 InfinityTime 菜单上传图片发布图集，回前台即可看到无限瀑布流图片墙。

环境要求

• PHP ≥ 7.4，启用 php-gd、php-exif。
• HEIC/AVIF：安装 php-imagick + libheif、ImageMagick + libheif 或 libheif-examples（heif-convert）；非标准路径在插件设置填。
• 上传限制：建议 upload_max_filesize / post_max_size ≥ 20M（8K 全景 JPG 常 15MB+）。
• 大图内存：自动放宽，约需 512M；服务器建议至少 1GB 内存。

使用体验

后台

1. 上传并发布图集 — 拖拽/多选上传、逐张标题/描述、拖拽排序、上传进度；AJAX 发布。
2. 已发布图集 — 展开编辑整组信息、每图信息、拖拽排序、删除图片/图集（均 AJAX）。
3. 站点信息 / 关于 / 联系方式 — 头像直传、名称、介绍（HTML 清洗）、联系方式（AJAX）。
4. WebP 转换设置 — 分组配置：保留原图 / 缩略图 / 普通图 / 全景图（宽度 + 质量滑块）；「恢复默认最佳设置」。
5. 维护 — 重建缩略图/全图、清理孤儿文件、重建尺寸字段、清理非插件文章（先预览后删除），支持断点续跑与并发锁。

前台

• 首页无限瀑布流，滚到底自动加载更多；缩略图按需加载。
• 点击缩略图打开灯箱；360 全景拖拽旋转/缩放；普通图左右切换；EXIF 侧栏随图联动。
• 底部悬浮胶囊：左侧「关于」面板、右侧全屏。

目录结构

InfinityTime-release/
├─ README.md  ├─ 部署与可移植性说明.md
└─ usr/
   ├─ themes/InfinityTime/ (index.php / functions.php / assets/… / pannellum.js/css)
   └─ plugins/InfinityTime/ (Plugin.php / panel.php / Lib/)

常见问题

• 全景上传失败？ 之前是 GD 在 8192×4096 时内存不足，v1.6.0 已按像素动态放宽内存；确认后台「全景图宽度」为 0（不裁剪）或一个合理值。
• 全景不清晰？ 用「全景图宽度 = 0」+「全景图质量 ≥ 90」，然后重新上传或在维护里重建。
• 重建后没变化？ AJAX 完成后不刷新；同 URL 有浏览器缓存，强刷（Cmd+Shift+R）再看。
• 清理非插件文章？ 维护 → 清理非插件文章，会先列出数量/标题再确认删除（不可恢复）。

发版（自动）

推送 vX.Y.Z 标签即自动发版（GitHub Actions）：

git tag v1.7.0 && git push origin v1.7.0

工作流校验主题/插件/releases.json 版本一致 → 打包两个 zip → 创建 Release（正文自动取 update.md 当前版本 Changelog）。

许可与致谢

本主题/插件基于 MIT 许可（见 usr/themes/InfinityTime/LICENSE）。下述开源项目被直接引用/内嵌，特此致谢并保留其许可声明。

内嵌的前端库（随主题打包、本地加载，不依赖 CDN）

项目	用途	许可	来源
Pannellum	360°/全景图查看器（拖拽、缩放、全屏）	MIT	github.com/mpetroff/pannellum
jQuery	基础 DOM/事件库	MIT	jquery.org
jQuery poptrox	灯箱/图集弹窗	MIT	github.com/ajlkn/jquery.poptrox
browser.js	浏览器/设备检测	MIT	随 Multiverse 主题附带（@ajlkn）
breakpoints.js	响应式断点	MIT	随 Multiverse 主题附带（@ajlkn）
Multiverse	基础主题骨架（main.js/main.css/布局）	CCA 3.0	html5up.net/multiverse
TimePlus	本主题的二次开发母版	MIT（© zhheo）	github.com/zhheo/TimePlus
iconfont	站点图标字体（本地内嵌）	以授权来源平台为准	主题 assets/fonts/

说明

• Multiverse（HTML5 UP） 采用 CCA 3.0，使用时需保留作者与出处标注；本主题已在 main.js 文件头保留原版权声明。
• TimePlus（zhheo） 为本主题的直接母版（其本身亦基于 Multiverse）；主题的 LICENSE 为 MIT（© zhheo）。
• iconfont 为本地内嵌字体，源码未单独标注；如需对外分发，请按图标来源平台（如 Iconfont）的授权条款补充说明。
• 插件后端依赖系统已安装的工具（php-gd、ImageMagick、heif-convert/libheif 等），各工具由各自项目授权、随系统提供。
• 本项目未引入任何新的第三方运行时库；灯箱 / EXIF / 瀑布流的动效基于 jQuery 内置缓动与 CSS 缓动实现，不依赖 GSAP、Three.js 等额外库。

若你基于本主题二次分发，请同时保留上述第三方项目的许可声明。