# 画面設計書 26-InsertMediaAdvancedSettings画面

## 概要

本ドキュメントは、Wikipedia iOSアプリにおけるメディア挿入の詳細設定画面（InsertMediaAdvancedSettingsViewController）の設計仕様を記載したものである。

### 本画面の処理概要

InsertMediaAdvancedSettings画面は、Wikipedia記事に挿入する画像の詳細設定（テキスト折り返し、画像位置、画像タイプ、画像サイズ）を行うための画面である。InsertMediaSettings画面の「Advanced settings」ボタンから遷移し、各設定項目は専用のサブ画面で選択する。

**業務上の目的・背景**：Wikipediaの画像挿入では、画像の表示位置やサイズ、フレームタイプなどを細かく設定できる。本画面は、これらの詳細設定をユーザーフレンドリーなUIで提供し、Wikitextの知識がなくても適切な画像挿入を行えるようにする。

**画面へのアクセス方法**：InsertMediaSettings画面で「Advanced settings」ボタンをタップ

**主要な操作・処理内容**：
1. テキスト折り返し設定のON/OFFを切り替え
2. 画像位置設定画面に遷移して位置を選択
3. 画像タイプ設定画面に遷移してタイプを選択
4. 画像サイズ設定画面に遷移してサイズを選択
5. 設定完了後、戻るボタンで親画面に反映

**画面遷移**：
- 遷移元：InsertMediaSettings画面
- 遷移先：InsertMediaImagePositionSettings画面、InsertMediaImageTypeSettings画面、InsertMediaImageSizeSettings画面

**権限による表示制御**：特になし。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 28 | メディア挿入 | 補助機能 | 画像位置、サイズ、タイプの詳細設定 |

## 画面種別

設定画面

## URL/ルーティング

iOSネイティブアプリのため、URLベースのルーティングは存在しない。

## 入出力項目

### 入力項目

特になし（画面遷移時に自動的に初期値が設定される）

### 出力項目（プロパティ）

| 項目名 | 種別 | データ型 | 説明 |
|--------|------|----------|------|
| advancedSettings | 出力 | AdvancedSettings | 設定結果（wrapTextAroundImage, imagePosition, imageType, imageSize） |

## 表示項目

### ナビゲーションバー

| 項目名 | 表示内容 | 備考 |
|--------|----------|------|
| タイトル | "Advanced settings" | WMFLocalizedString使用 |
| 左ボタン | Back | 標準の戻るボタン |

### 設定項目一覧

| 項目名 | 表示内容 | アクセサリ | 遷移先 | 備考 |
|--------|----------|----------|--------|------|
| Wrap text around image | - | UISwitch | - | デフォルトON |
| Image position | 選択値（Right/Left/Center/None） | DisclosureIndicator | ImagePositionSettings | テキスト折り返しOFF時は無効 |
| Image type | 選択値（Thumbnail/Frameless/Frame/Basic） | DisclosureIndicator | ImageTypeSettings | - |
| Image size | 選択値（Default/Custom） | DisclosureIndicator | ImageSizeSettings | - |

## イベント仕様

### 1-テキスト折り返しスイッチ変更

テキスト折り返しのON/OFFを切り替える。

**処理フロー**：
1. textWrappingSwitch.addTargetで登録されたtoggleImagePositionEnabledState(_:)が呼び出される
2. tableView.reloadRows(at: [IndexPath(row: 1, section: 0)], with: .automatic)でImage positionセルを更新
3. OFFの場合、Image positionセルは無効化され、位置はnoneに設定される

### 2-Image positionセルタップ

画像位置設定画面に遷移する。

**処理フロー**：
1. tableView(_:didSelectRowAt:)が呼び出される
2. viewModels[indexPath.row].onSelection?()を実行
3. push(imagePositionSettingsViewController)でナビゲーション遷移

**条件**：テキスト折り返しがONの場合のみ有効

### 3-Image typeセルタップ

画像タイプ設定画面に遷移する。

**処理フロー**：
1. tableView(_:didSelectRowAt:)が呼び出される
2. viewModels[indexPath.row].onSelection?()を実行
3. push(imageTypeSettingsViewController)でナビゲーション遷移

### 4-Image sizeセルタップ

画像サイズ設定画面に遷移する。

**処理フロー**：
1. tableView(_:didSelectRowAt:)が呼び出される
2. viewModels[indexPath.row].onSelection?()を実行
3. push(imageSizeSettingsViewController)でナビゲーション遷移

### 5-戻る操作

設定を保持したまま親画面に戻る。

**処理フロー**：
1. ナビゲーションの戻るボタンまたはスワイプジェスチャー
2. 各サブViewControllerから設定値を取得（selectedImagePosition, selectedImageType, selectedImageSize）
3. advancedSettingsプロパティを通じて親画面から参照可能

## データベース更新仕様

### 操作別データベース影響一覧

この画面ではローカルデータベースへの更新は行われない。設定値はメモリ上で保持される。

| 操作（イベント） | 対象 | 操作種別 | 概要 |
|----------------|------|---------|------|
| なし | - | - | - |

## メッセージ仕様

| ID | 種別 | メッセージ内容 | 表示条件 |
|----|------|----------------|----------|
| - | - | この画面では特別なメッセージは表示されない | - |

## 例外処理

| 例外条件 | 処理内容 |
|----------|----------|
| なし | - |

## 備考

- advancedSettingsプロパティはcomputedプロパティで、常に最新の設定値を返す
- viewModelsはlazyプロパティで、各行のViewModel（タイトル、detailText、accessoryView等）を動的に生成
- サブ画面への遷移時にテーマを適用（viewController.apply(theme: theme)）
- viewWillAppear時にtableView.reloadData()を呼び出し、サブ画面から戻った際の設定値を反映

---

## コードリーディングガイド

本画面を理解するために参照すべきファイルと、推奨する読み解き順序を以下に示す。

### 推奨読解順序

#### Step 1: データ構造を理解する

AdvancedSettings構造体とViewModelの構造を理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | InsertMediaSettingsViewController.swift | `Wikipedia/Code/InsertMediaSettingsViewController.swift` | 行42-137: AdvancedSettings構造体（ImagePosition, ImageType, ImageSize） |
| 1-2 | InsertMediaAdvancedSettingsViewController.swift | `Wikipedia/Code/Advanced Settings/InsertMediaAdvancedSettingsViewController.swift` | 行14-32: ViewModel構造体 |

**読解のコツ**: AdvancedSettingsの各enumがdisplayTitleを持ち、UIに表示されることを理解する。

#### Step 2: エントリーポイントを理解する

InsertMediaAdvancedSettingsViewControllerの構造を理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | InsertMediaAdvancedSettingsViewController.swift | `Wikipedia/Code/Advanced Settings/InsertMediaAdvancedSettingsViewController.swift` | 全体 |

**主要処理フロー**:
1. **行5**: static let title - タイトル文字列
2. **行8-12**: advancedSettingsプロパティ - 設定値の集約
3. **行34-39**: textWrappingSwitch - UISwitch設定
4. **行41-43**: サブViewController（lazy初期化）
5. **行45-66**: viewModelsプロパティ - 4つの行のViewModelを動的生成

#### Step 3: テーブルビュー実装を理解する

UITableViewDataSourceとUITableViewDelegateの実装を理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | InsertMediaAdvancedSettingsViewController.swift | `Wikipedia/Code/Advanced Settings/InsertMediaAdvancedSettingsViewController.swift` | 行127-168 |

**主要処理フロー**:
- **行136-148**: cellForRowAt - ViewModelに基づくセル設定
- **行164-167**: didSelectRowAt - onSelectionクロージャの実行

#### Step 4: サブ画面との連携を理解する

各設定画面からの値取得を理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 4-1 | InsertMediaAdvancedSettingsViewController.swift | `Wikipedia/Code/Advanced Settings/InsertMediaAdvancedSettingsViewController.swift` | 行10-12 |

**主要処理フロー**:
- imagePositionSettingsViewController.selectedImagePosition(isTextWrappingEnabled:)
- imageTypeSettingsViewController.selectedImageType
- imageSizeSettingsViewController.selectedImageSize

### プログラム呼び出し階層図

```
InsertMediaAdvancedSettingsViewController
    │
    ├─ UITableView
    │      │
    │      ├─ Row 0: Wrap text around image
    │      │      └─ UISwitch (textWrappingSwitch)
    │      │
    │      ├─ Row 1: Image position
    │      │      └─ onSelection → InsertMediaImagePositionSettingsVC
    │      │
    │      ├─ Row 2: Image type
    │      │      └─ onSelection → InsertMediaImageTypeSettingsVC
    │      │
    │      └─ Row 3: Image size
    │             └─ onSelection → InsertMediaImageSizeSettingsVC
    │
    ├─ InsertMediaImagePositionSettingsViewController
    │      └─ selectedImagePosition(isTextWrappingEnabled:) → ImagePosition
    │
    ├─ InsertMediaImageTypeSettingsViewController
    │      └─ selectedImageType → ImageType
    │
    └─ InsertMediaImageSizeSettingsViewController
           └─ selectedImageSize → ImageSize
```

### データフロー図

```
[入力]                     [処理]                              [出力]

ユーザー操作
    │
    ├─▶ テキスト折り返しスイッチ ──▶ textWrappingSwitch.isOn
    │
    ├─▶ 画像位置選択 ──────────────▶ ImagePositionSettingsVC
    │                                     └─▶ selectedImagePosition
    │
    ├─▶ 画像タイプ選択 ────────────▶ ImageTypeSettingsVC
    │                                     └─▶ selectedImageType
    │
    └─▶ 画像サイズ選択 ────────────▶ ImageSizeSettingsVC
                                          └─▶ selectedImageSize

              │
              ▼
        advancedSettings
              │
              ├─▶ wrapTextAroundImage: Bool
              ├─▶ imagePosition: ImagePosition
              ├─▶ imageType: ImageType
              └─▶ imageSize: ImageSize
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| InsertMediaAdvancedSettingsViewController.swift | `Wikipedia/Code/Advanced Settings/InsertMediaAdvancedSettingsViewController.swift` | ソース | 本画面のコントローラ |
| InsertMediaImagePositionSettingsViewController.swift | `Wikipedia/Code/Advanced Settings/InsertMediaImagePositionSettingsViewController.swift` | ソース | 画像位置設定画面 |
| InsertMediaImageTypeSettingsViewController.swift | `Wikipedia/Code/Advanced Settings/InsertMediaImageTypeSettingsViewController.swift` | ソース | 画像タイプ設定画面 |
| InsertMediaImageSizeSettingsViewController.swift | `Wikipedia/Code/Advanced Settings/InsertMediaImageSizeSettingsViewController.swift` | ソース | 画像サイズ設定画面 |
| InsertMediaSettingsViewController.swift | `Wikipedia/Code/InsertMediaSettingsViewController.swift` | ソース | 親画面（AdvancedSettings定義） |
| Theme.swift | `Wikipedia/Code/Theme.swift` | ソース | テーマ定義 |
