3枚未満の画像で自動グリッドの設定を便利にする

貢献 特徴
1

自動画像グリッドの最小画像数の設定可能化

自動画像グリッド機能に制限があることに気づきました。

現在、自動グリッドの動作はサイト設定の「自動グリッド画像」によって制御されているように見えますが、コンポーザーが [grid]...[/grid] を挿入する実際の閾値はフロントエンドのコードで固定されています。

関連するコンポーザーのロジックは現在、ハードコードされた値を使用しています：

const MIN_IMAGES_TO_AUTO_GRID = 3;

したがって、私の理解では、管理者は現在以下の中から選択することになります：

現在管理者が行えること 結果
自動グリッド画像を有効化 3つ以上の連続した画像のアップロードは自動的に [grid]...[/grid] でラップされます
自動グリッド画像を無効化 自動グリッドのラッピングは行われません
閾値を3から他の数値に変更 現在、サイト設定としては利用できません

問題は、3 がすべてのコミュニティにとって適切な閾値ではないということです。

一部のサイトでは、自動グリッドは有用ですが、ユーザーがより多くの画像をバッチでアップロードした場合にのみ有効です。例えば、管理者は3つの画像がアップロードされた時点でトリガーされるのではなく、5、6、10、または他の値で自動グリッドを開始させたい場合があります。

これは、ユーザーが説明文と組み合わせて少数の画像をインラインでアップロードすることが多いコミュニティ、ただし大きなギャラリーはグリッドに圧縮されるべきであるというケースで特に有用です。

提案される方向性

これは、コンポーザーが自動的にグリッドを挿入する前に必要な連続した画像アップロードの最小数に対する設定可能なサイト設定を追加することで改善できると思います。

例えば以下のような設定：

auto_grid_images_minimum_count
```\n
例えば：

| 設定 | 例の値 |
| --- | --- |
| `enable_auto_grid_images` | `true` |
| `auto_grid_images_minimum_count` | `5` |

これにより、自動グリッドは引き続き利用可能ですが、設定された閾値に達した時点でのみトリガーされます。

この新しい設定のデフォルト値が `3` である場合、既存の動作をデフォルトとして維持しつつ、管理者により多くの制御を可能にします。

## 実験ブランチ / 可能な先行開始

Discourseの開発経験がより豊富な方がフォークして、クリーンアップしたり、このアイデアを進めたりする時間がある場合のために、ここに小さな実験ブランチを作成しました：

[image-grid-num-setting branch](https://github.com/Ethsim12/discourse/tree/image-grid-num-setting)

このブランチは、磨かれたPRとして意図されたものではありません。むしろ、意図された方向性を示す出発点です：

- 自動グリッドの最小画像数に対する新しいサイト設定を追加
- クライアントにその設定を公開
- コンポーザーのアップロードコード内のハードコードされた `MIN_IMAGES_TO_AUTO_GRID = 3` チェックを、設定された値に置き換え
- 既存の自動グリッドの文言が閾値が常に3であることを示唆しなくなるよう、管理者設定のテキストを更新
- 必要に応じてフロントエンドの仕様を追加/更新

私が考えていたフロントエンドの変更は、概ね以下のようなものです：

```js
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;
}

また、PR #36014 にDiscourseスタイルの列挙型サイト設定の最近の例もあります：

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

「いいね！」 2
2

特にあなたの経験についてもう少し詳しく教えていただけますか？

どのような設定を使用したいですか、またその理由は？

3

ありがとうございます。その通りです。

私のサイトでは、しきい値を5枚の画像に設定するでしょう。

その理由は、多くの投稿が「ギャラリー」とは言えない自然な状態で3枚の画像を含むことがあるからです。例えば、ユーザーは以下をアップロードするかもしれません：

  • 問題のスクリーンショット
  • 関連する設定やエラーを示す2枚目のスクリーンショット
  • 結果や比較を示す3枚目の画像

このような場合、auto-gridは連続する画像に適用され、視覚的な散らかりを防ぐのに役立ちます。

また、多数の画像アップロードを促進することは、ストレージやバックアップのサイズにとって理想的ではないという点にも注意しています。そのため、ユーザーを大規模な画像多用の投稿に誘導しようとはしていません。私の主張は、複数の画像がすでにアップロードされている場合のレイアウト制御に関するものです。

私にとって、auto-gridは投稿がいくつかの説明用画像を超えて、より大きな画像のバッチに明確に移行したときに、より有用になります。私のサイトでは、そのためのしきい値として5枚の画像が適切に感じます。

したがって、auto-gridを完全に無効にしたいわけではありません。この機能は特定のケースで気に入っています。問題は、現在の固定しきい値の3が、説明の一部として小さな画像グループが頻繁に使用されるコミュニティにおいて、少し過激すぎる点だけです。

そのため、auto_grid_images_minimum_countのようなサイト設定が有用だと考えています。現在の動作を好むサイトは3のままにできますが、私のようなサイトは5、2、または他の値に引き上げることができます。

「いいね！」 2
4

あなたの具体的なケースでは、代わりに以下のような方法はどうでしょうか？

  • auto-grid がデフォルトで “carousel” レイアウトを使用する or
  • ユーザーがグループ全体を “ungrid” するのがより容易になる

今、別の考えが浮かびました…

おそらく、「画像グループ」という概念と、そのグループの「レイアウト」をさらに明確に分離する価値があるかもしれません。

例えば、リッチエディターでグループに対して3つのオプション（リスト、グリッド、カルーセル）を切り替えられるようにし、それらをグループ内に保持したままにすれば、デフォルトとして選択されるヒューリスティックがユーザーの希望と一致しない場合に、ユーザーやモデレーターがワンクリックで希望するレイアウトを選択しやすくなるかもしれません。

5

はい、その分離は理にかなっていると思います。

私の場合、主な問題はグリッドが存在することそのものではなく、現在のヒューリスティック処理が3つの連続した画像というかなり早い段階でレイアウトの決定を行い、その決定を [grid]...[/grid] マークアップとして投稿内に露出させてしまう点にあります。

「これは画像のグループです」ということと、「このグループはリスト/グリッド/カルーセルとして表示されるべきです」ということを分離することは、長期的にはよりクリーンなモデルになるでしょう。

私には次のようなアプローチが理にかなっているように思えます。

  • コンポーザーが画像グループを認識または作成します。リッチテキストエディタでは認識し、マークダウンエディタでは作成します。
  • グループにはレイアウトの選択肢（リスト、グリッド、またはカルーセル）があり、これはBBCodeのパラメータとして設定されます。
  • ユーザーやモデレーターは、マークダウンエディタの2番目のペインを介して、ワンアクションでそのレイアウトを変更できます。
  • 投稿は、ユーザーが [grid] タグを理解したり、それを慎重に保存したりすることに依存しません。これは、単一ペインのリッチテキストエディタが有用である点です。

これは、しきい値の設定を追加するだけよりも多くのケースを解決する可能性がありますが、それでもより広範な機能です。

私の特定のサイトについては、小規模な画像グループのデフォルトは依然としてリストを選択すると思います。3つのスクリーンショットは、ギャラリーではなく説明の一部であることが多いからです。大規模なバッチについては、グリッドやカルーセルが有用であると考えられます。

したがって、改善にはおそらく2つのレベルがあるでしょう。

  1. 現在の動作に対する小さな管理者設定、例えば auto_grid_images_minimum_count（既存のデフォルト値3を維持）
  2. その後、リスト/グリッド/カルーセルを手動でマークアップを編集せずにより簡単に変更できる、より豊富な画像グループのレイアウトモデル。ただし、これは別の機能リクエストトピックに属するものだと考えています。

ただし、2番目の方向性が優先される場合、そのしきい値設定に関する私の最初の投稿の提案は重要度が下がるかもしれませんが、根本的な問題は同じだと思います：管理者とユーザーは、複数の画像が通常のインラインの説明用画像ではなく、ギャラリー形式のブロックとして扱われるべきかどうかについて、もう少し制御できる必要があります。

「いいね！」 1
6

さて、はい、今私が考えているのは、以下のようにすることです：

  • 1枚以上の画像がアップロードされた場合、[grid]でラップする
    • 数が3以下の場合、デフォルトで[grid mode=list]にする
    • 数が3より大きく10以下の場合、デフォルトで[grid mode=grid]にする
    • 数が10より大きい場合、デフォルトで[grid mode=carousel]にする
  • リッチモードとプレビューでは、ユーザーがlist、grid、carouselモード間で簡単に切り替えられるようにする

@chapoi と @renato、この件についてどう思いますか？

「いいね！」 1
7

説得力に欠ける。OPのスクリーンショットの例でも同様だ。私はこれらを並べて表示したい。

何かを変更するよりも、元の提案された設定を支持する。ただし、この機能リクエストにさらに投票が集まるか、他の場所でも同様の意見が聞かれるまで、行動を待つべきだ。

「いいね！」 1