目次

目論見

モジュールメモ

画面メモ(コンパネ)

設計方針

ܐܶܓܰܪܬܳܟ

post contents
{
	"deck_name":"RWS";@selected
	"spread_name":"three_cards",@selected
	"selected_cards":["the_fool","death","the_wheel_of_fortune"], @generated
	"reversal_array":[0,0,1], @generated
	"reversal_on":true, @selected
	"background":"bg_purple", @selected
	"lang":"ja"@selected
}

テンプレート

フレームデザイン

参考リンク

type1,2のデッキについて

記事 https://tarot-heritage.com/2023/10/28/celebrating-the-tarot-de-marseille-type-i/

書籍ミラノ版デッキの類似品(元書籍:https://archive.org/details/propheticaleduca00vanr/

【kabalah】

カウンセリングの言葉としてのタロット

生成AI

作画

画像処理手順

仕様

エクスポート機能が漏れていたので、フェーズ6にエクスポートと共有機能を統合して追加しました。以下が修正済みの最終バージョンです。

## 段階的な開発フェーズの詳細 (統合・修正版)

フェーズ1: 基礎アプリの構築 (MVP: Minimum Viable Product) 目標: - ローカルのプレーンテキストファイルを開き、表示する。 - テキスト選択範囲に簡単なアノテーションを付与できる。 - アノテーションはメモリ内で保持し、SQLiteはまだ使わない。 - デフォルトフォントでテキストを表示

機能詳細: - ファイル選択ダイアログでローカルのプレーンテキストファイルを開く。 - テキストをElectronウィンドウ内に表示。 - 選択したテキスト範囲にコメントやタグを付与できるようにする。 - アノテーションはJSONファイルとしてローカルに保存。 - デフォルトフォントでのプレーンテキスト表示。 - 選択範囲をハイライトし、簡易的な可視化を行う。

技術要素: - Electronの`dialog.showOpenDialog()`でファイル選択ダイアログを作成。 - `fs.readFileSync`でテキストファイルを読み込む。 - Reactの`useState`を使い、選択範囲の取得と状態管理。 - `window.getSelection()`で選択されたテキストを取得。 - `fs.writeFileSync`でJSONファイルへの保存処理。 - Electronの基本ウィンドウ構築 (`BrowserWindow`)。

フェーズ2: アノテーションデータの永続化 (SQLite導入) 目標: - アノテーションデータをSQLiteに保存し、再起動後も復元できる。 - テキストの表示サイズを変更可能にする。

機能詳細: - SQLiteデータベースを初期化し、アノテーションデータを格納するテーブルを作成。 - アノテーションデータには、選択範囲の`start`と`end`の位置、選択テキスト、タグ、コメントを保存。 - アプリ起動時にSQLiteからデータを読み込み、該当範囲をハイライト。 - テキストの表示サイズをスライダーやセレクトボックスで変更できるようにする。

技術要素: - `better-sqlite3`または`sqlite3`モジュールを導入。 - SQLiteデータベースの初期化とテーブル作成(`CREATE TABLE IF NOT EXISTS`)。 - Reactの状態管理で表示サイズを調整(`useState`でサイズをリアルタイム変更)。 - CSSで`font-size`を動的に変更。 - ElectronのIPC通信を使い、React側からElectronプロセスへDB操作リクエストを送る。

フェーズ3: アノテーション管理UIの追加 目標: - 付与したアノテーションを一覧表示し、編集・削除が可能な管理UIを作成。 - 表示フォントを選択可能にする

機能詳細: - アノテーションリストを表示するサイドパネルを作成。 - リスト内のアノテーションをクリックすると該当部分にスクロールしてハイライト。 - アノテーションの編集・削除が可能。 - フォント選択用のセレクトボックスを追加し、ユーザーが任意のフォントでテキストを表示できるようにする。 - フォント変更が即座に反映される。

技術要素: - Reactでサイドパネルコンポーネントを作成。 - SQLiteからアノテーションデータを取得し、リスト表示。 - フォント選択用の`<select>`要素を作成し、変更時にCSSで`font-family`を適用。 - フォントリストは`window.getFonts()`で取得可能。

フェーズ4: 高度なアノテーション機能 (ズレ補正・テキストマッチング) 目標: - `TextQuoteSelector`を導入し、プレーンテキストの変更があってもアノテーションが再適用される。

機能詳細: - アノテーション付与時に選択範囲のテキスト(`exact`)、前後のテキスト(`prefix`、`suffix`)を保存。 - ファイル変更後も一致するテキストを特定し、アノテーションを適用する。 - 一致しない場合は、エラーや候補を表示。

技術要素: - `TextQuoteSelector`を実装し、前後関係でズレを補正。 - 正規表現を使用して、選択テキストの位置を再検索。

フェーズ5: RTL言語のサポート (アラビア語・ヘブライ語など) 目標: - 右から左 (RTL) 言語の表示とアノテーション付与をサポート。 - アノテーション本文(body)はLTRで表示され、選択テキスト部分のみRTL。

機能詳細: - テキストの一部がRTLでも正しく表示されるように、RTLモード切り替えボタンを追加。 - アノテーション自体は通常のLTR方向で保存。 - 選択されたテキストがRTLであることを記録。

技術要素: - CSSの`direction: rtl`を適用。 - `Unicode-bidi: embed`を使用し、特定要素のみにRTLを適用。 - SQLiteのデータに`isRTL`フラグを追加して、選択テキストがRTLか判別。

フェーズ6: プロジェクト管理・複数ファイル対応 + エクスポート機能 目標: - 複数のファイルを管理し、プロジェクト単位でアノテーションを保存。 - アノテーションをHTML、Markdown、JSON形式でエクスポートし、他のアプリケーションで利用可能にする。

機能詳細: - プロジェクトディレクトリを選択し、フォルダ内の全テキストファイルにアノテーションを付与できる。 - アノテーションをHTMLまたはMarkdownに埋め込んで出力。 - Web Annotation Data Model (W3C) に準拠したJSON形式でエクスポート。

技術要素: - Electronの`dialog.showOpenDialog()`でディレクトリ選択。 - SQLiteでファイルごとにレコードを分け、プロジェクトIDで紐付け。 - `fs.writeFile`を使い、HTML・Markdown・JSONを生成。