优化自动网格设置,少于3张图片时更便捷

自动图片网格的最小图片数量可配置

我遇到了自动图片网格功能的一个限制。

目前,自动网格的行为似乎由站点设置中的“自动网格图片”选项控制,但编辑器插入 [grid]...[/grid] 的实际阈值仍然在前端代码中是固定的。

相关的编辑器逻辑当前使用硬编码值:

const MIN_IMAGES_TO_AUTO_GRID = 3;

因此,据我了解,管理员目前的选择如下:

管理员当前可以做的 结果
启用自动网格图片 上传 3 张或更多连续图片时,会自动包裹在 [grid]...[/grid]
禁用自动网格图片 不进行自动网格包裹
将阈值从 3 更改为其他数字 目前不可用作站点设置

问题在于 3 并不一定适合每个社区。

对于某些站点,自动网格很有用,但仅在用户上传较大批量的图片时才有用。例如,管理员可能希望自动网格从 5、6、10 或其他值开始,而不是在上传 3 张图片时立即触发。

这对于那些用户经常在内联说明文本中上传少量图片,但较大的图库仍应压缩为网格的社区来说尤其有用。

建议方向

我认为可以通过添加一个可配置的站点设置来改进这一点,用于在编辑器自动插入网格之前连续上传图片的最小数量。

例如:

auto_grid_images_minimum_count

例如:

设置 示例值
enable_auto_grid_images true
auto_grid_images_minimum_count 5

这样,自动网格仍然可用,但只有在达到配置的阈值时才会触发。

如果新设置的默认值为 3,则保留现有行为作为默认值,同时给予管理员更多控制权。

实验分支 / 可能的起步

我在这里创建了一个小的实验分支,以防有更多 Discourse 开发经验的人有时间分叉它、清理它或推进这个想法:

image-grid-num-setting branch

该分支并非作为完善的 PR 提供。它更多地是一个起点,展示预期的方向:

  • 添加一个新的站点设置用于自动网格的最小图片数量
  • 将该设置暴露给客户端
  • 用配置值替换编辑器上传代码中的硬编码 MIN_IMAGES_TO_AUTO_GRID = 3 检查
  • 更新管理员设置文本,使现有的自动网格文字不再暗示阈值总是 3
  • 如有需要,添加/更新前端规范

我设想的前端更改大致如下:

const minImagesToAutoGrid = Number(
  this.siteSettings.auto_grid_images_minimum_count ?? 3
);

if (
  this.siteSettings.enable_auto_grid_images &&
  this.#consecutiveImages?.length >= minImagesToAutoGrid &&
  this.textManipulation
) {
  this.textManipulation.autoGridImages([...this.#consecutiveImages]);
  this.#consecutiveImages.length = 0;
}

还有一个最近的 Discourse 风格枚举站点设置的示例在 PR #36014 中:

PR #36014 - FEATURE: adds calendar_upcoming_events_default_view setting

该 PR 是针对日历和事件插件的,而不是直接针对图片网格,所以我并不建议它影响此功能。我提到它是因为它似乎展示了这种可配置站点设置的一种有用实现模式:定义设置,将其暴露给客户端,然后通过 siteSettings 在前端读取它。

相关链接

关于关闭自动网格图片的原始讨论:

Turning off auto-grid-images?

自动图片网格公告:

Automatically apply grids to image uploads

展示站点设置架构的示例 PR:

PR #36014 - FEATURE: adds calendar_upcoming_events_default_view setting

我的实验分支:

image-grid-num-setting branch

1 个赞