quickspell 導入方法・使い方

# quickspell 導入方法・使い方
### 何？
--------------------------------------------------------------------------------
AIの画像生成でpromptの編集を支援するためのツール
管理と編集を一挙に行いたい、ワードの入れ替え、キャラ・構図・プレイなど切り替えを簡易に行いたいという人におすすめ
現在はNovelAIとStable Diffusion web UI (試験的) をサポート

### 導入
--------------------------------------------------------------------------------
chromeの手順、firefoxでも同じような感じでできると思う
chromeでしかテストしてないのでそこは注意
firefox + Stable Diffusion web UIは多分動かないので注意、checkVisibilityを探して適当に書き換えて
1. ブラウザにTampermonkeyをインストールする
  [chrome ウェブストア](https://chrome.google.com/webstore/category/extensions?hl=ja)
  Tampermonkeyで検索、(多分)一番上にでてくるやつ
2. スクリプトを用意する
  [配布元](https://pastebin.com/Bv8EP0MF)
  [raw (直リンク)](https://pastebin.com/raw/Bv8EP0MF)
  **冒頭のコメントも含めた全文**をコピーする
3. スクリプトをセットアップする
  ブラウザで画像生成の画面を開いて、アドレスバー右のTampermonkeyのアイコンから、「新規スクリプトを追加…」
  出てきたテキストフォームにスクリプトを貼り付け、**Ctrl+Sで保存する**
  タブを更新したら使えるはず
4. 追加設定 (Novel AI以外で使いたい場合)
  Stable Diffusion web UIで使用する場合はスクリプトを読み込む対象の設定が必要かも
  スクリプト内の@matchで始まるコメントを追加するかエディタ上の設定タブから自分の環境に合わせたURLを追加する
  その他のページで試したい場合は「対応ページの追加について」を参照

### 使い方
--------------------------------------------------------------------------------
##### 最初
導入に成功したら左下に▲のボタンが見えるはず
クリックでパネルを開く、▼で閉じる

##### 上部
上に6つボタンがある、左から順に
- 開く/閉じる
- ＋ボタン: 入力欄の追加
- チェックボックス: 重複ワードを除外
- 🗹: 入力欄のチェック全解除
- ⤓: インポート quickspellのセーブデータを取り込む
- ↥: エクスポート quickspellのセーブデータを出力する

入力欄を作って入力すると黒背景のpromptプレビューが出るようになる
プレビュークリックでpromptをコピー

ボタンの間のテキストボックスはフィルタの指定
文字を入力すると入力にマッチする入力欄だけが表示される
スペース区切りでAND指定

##### 入力欄
ボタンとテキスト入力欄
- チェックボックス: 行を有効にするかどうか、有効だとプレビューに入る
- ❐: 入力欄の複製
- ↑: 入力欄を上に移動
- ↓: 入力欄を下に移動
- テキストボックス: promptの断片を入力する
- ー: 入力欄を削除

##### キー操作
基本quickspell側にフォーカスが当たってるときのみ有効、NovelAI側のUIでは何もしない
- Ctrl+Enter
  プレビューされているpromptをNovelAI側の入力欄に書き込む
  NovelAI側のプログラムも個別に状態を持ってて干渉するのでやや不安定
  最初になんか書いておかないといけない・NovelAIの入力欄でキー入力をしないと戻るなどの問題がある
  現状は Ctrl+Enter → Space  → Enter とかやってくれ
- Ctrl+↑/↓
  入力中の入力欄を1個上/下に移動
- Ctrl+F
  フィルタのテキストボックスにフォーカス
- Alt+↑/↓
  カーソル下の単語の重要度を変更
  {}か[]を足したり減らしたり
- Alt+←/→
  カーソル下の単語を入力欄内で移動
- Escape
  フィルタのリセット・パネルの非表示

##### 重複ワードの削除
有効な断片の複数に同じワードが入っているとき出力にそのまま含めるかどうか
削除する場合はあとに出てきたものが消える(はず)

##### セーブデータのインポート・エクスポート
jsonとして入力・出力できる
セーブデータのバックアップにどうぞ
すでにデータがある状態でインポートするときは現状のものを置き換えるか追加するかを選べる
エクスポートはOKを押すとファイルとして保存する

##### コメント構文
quickspellの入力フォームではコメントを書き込むことができる
構文は /* で始まり */ で終わる 範囲内がコメントとして扱われる
入れ子(コメントの中にコメント)はサポートしてない
実際のプロンプト出力には含まれないので断片の用途とか意味とかを書き込んでおくと便利
ワードの一部として扱うこともできるけどワード入れ替えや重要度変更の影響を受けるのでカンマで区切るのを推奨

例:
/* クオリティ1 */, masterpiece, highly detailed,

### 仕様とか
--------------------------------------------------------------------------------
入力したデータは3秒変更がなかったタイミングで保存してる
保存はローカル、タブをリロードしても残るけどブラウザのキャッシュを削除すると消える
出力のワード数は特に制限はしていない、貼ってみてオーバーしたら適当に削ってくれ

### 対応ページの追加について
--------------------------------------------------------------------------------
APP_ROOT_QUERY_FUNCTIONS と PROMPT_INPUT_QUERY_FUNCTIONS に関数を追加することで対応ページを増やすことができる
両方のリストからそれぞれ1つ以上要素が返ってきたときその組み合わせで初期化を行う

##### APP_ROOT_QUERY_FUNCTIONS
quickspellのUIをの親要素を指定する
現状はbody直下に置くので大抵はいじらないでも動くはず
ページのレイアウトの都合で後ろに表示されたりする場合は他の親を指定して
body以外の子として表示する関数を追加する場合はbodyを返す関数はコメントアウトした方がいい

##### PROMPT_INPUT_QUERY_FUNCTIONS
promptの出力先の要素を指定する
prompt入力のinputかtextareaを返す関数を書けばOK

### その他オプション
--------------------------------------------------------------------------------
##### OPTION_ADD_FRAGMENT_ON_TOP
入力欄を追加する際の位置を指定する
trueで一番上 falseで一番下

### エクスポートしたデータを他で使いたい
--------------------------------------------------------------------------------
そこまで複雑なjsonじゃないので適当に文字列抜き出して使って
jqインストールして jq '.fs[].te' とか
よくわかんなかったら↓のページ開いてJSONの欄にエクスポートしたデータを貼り付けたら断片部分だけ抜き出せる
https://jqplay.org/s/Eu-jXTIZ_D_v

### 注意
--------------------------------------------------------------------------------
quickspellの使用、使用不能による損害について作者は一切の責任を負いません
それはそれとしてバグや要望はフィードバックがあれば対応するかも
セーブデータ保全のため定期的なエクスポートを推奨