「星墓編成ツール」について
ツールを使ってみる
📝 キャラクター編集エリア（左側）
画面左側のエリアでは、編成するキャラクターの情報を設定します。ここで設定したキャラクターを右側の表へドラッグ＆ドロップしてチームを編成します。
🖼️ 画像の設定
- 3つの方法で画像を追加: 「画像を選択」ボタンでのファイルアップロード、「リンクから取得」ボタンでのURL指定、クリップボードからの直接ペースト（Ctrl+V）に対応しています。
- 自動トリミング: 画像を追加すると、中央を基準とした正方形に自動でトリミングされます。
- Base64変換: 追加された画像はすべてテキストデータ（Base64）に変換されます。これにより、オフラインでの利用や、後述するエクスポート機能で画像を含んだデータ保存が可能です。ただし、リンクから取得する場合ほとんどの場合でCORSエラーではじかれます。github pagesの静的サイトの都合によるものなのであしからず。
✨ 詳細情報の設定
- 名前: 名前を自由に入力できます。
- 役割（メイン/サブ）: メイン、サブ2、サブ3、サブ4。選択した役割に応じて、画像の枠色が赤・青・黄・緑に変化します。サブ垢勢のために。
- わくわくの実: 4つの実をプルダウンから選択できます。一度選択した実は、他のプルダウンの選択肢から除外され、重複を防ぎます。ただし、
失神のみ重複して選択可能です。
- 魂の紋章: わくわくの実と同様に、4つの紋章を重複しないように選択できます。
📋 編成テーブル（右側）
画面右側の表は、クエストごとのチーム編成を記録・管理するためのエリアです。
🖱️ ドラッグ＆ドロップ操作
- 編成への追加: 左側で作成したキャラクター(最低でも画像のみ)を、右側の表の「編成」列にあるセルへドラッグ＆ドロップで配置できます。1つのセルに最大4体まで配置可能です。
- 自動整列: セルにドロップされたキャラクターは、役割（メイン→サブ2→…）の順番に自動で並び替えられます。
- 編集エリアへの差し戻し: 表に配置したキャラクターを左側の編集エリアへドラッグ＆ドロップすると、そのキャラクターの情報を再度編集できます。
👀 便利な表示機能
- クリックでプレビュー: 表のキャラクターをクリックすると、左側の編集エリアが「プレビューモード」に切り替わります。内容を確認でき、別のキャラクターをクリックすればプレビュー対象も切り替わります。（※編集中はプレビュー不可）
- ホバーで情報表示: 表のキャラクターにマウスカーソルを合わせると、名前・わくわくの実・魂の紋章が小さなウィンドウで表示され、素早く情報を確認できます。
- メモ機能: 「貸しモン」「備考」のセルは直接クリックしてテキストを入力できます。貸しモン情報を簡単に書けます。改行も可能で、内容が溢れた場合はスクロールして確認できます。
💾 データ管理機能
ツールの状態を保存・共有するための機能を備えています。
⚙️ 保存と入出力
- 自動保存 (localStorage): 編集エリアや表の内容はすべて、操作するたびに自動でブラウザに保存されます。次回ページを開いた際には、前回の状態が完全に復元されます。
- エクスポート: 表の左上にある「エクスポート」ボタンを押すと、画像データを含めた全ての編成情報を一つのJSONファイルとしてダウンロードできます。データのバックアップや共有に最適です。
- インポート: 「インポート」ボタンから、エクスポートしたJSONファイルを読み込ませることで、保存した状態をいつでも復元できます。
- クリア機能: 「表をクリア」ボタンで、確認ダイアログの後に表の内容（保存データ含む）を一括でリセットできます。