HAUSOS

ユーザ用ツール

サイト用ツール

resource:environment

目次

目論見

モジュールメモ

  • summernoteでリッチテキスト
  • comments-xtdでコメント
  • django-ajaxで通信
  • django-hashids
  • django-allauth
  • django-bootstrap5
  • crispy-form
  • widget-tweaksでテンプレート上で要素クラス指定
  • ViewFlowで状態管理する？ https://github.com/viewflow/viewflow
  • haystackで検索する

画面メモ（コンパネ）

  • フォームビュー
    • 占いたいテーマを書く
    • デッキ、スプレッド方法など色々きめる
    • スプレッドする
    • リーディング内容を作成する（一時保存する。確定する）

設計方針

ܐܶܓܰܪܬܳܟ

  • 文字画像はFastAPIで小サービスをたてる
  • エンジン側では小サービスを参照するが、ディスクキャッシュによりAPI利用を減らす
  • django-ajaxで画面内での処理をサーバサイドサイドに依頼する
  • 編集中の状態はクライアントサイドJSを介してsessionStorageを使って管理する（暫定）
  • クライアントJSから直接APIを叩かない（django-ajaxを介してpythonから仲介してAPIを叩く）
  • Gravatar or Boring は小サービスでプロキシする
  • Boringはセルフホストする
  • 一時保存結果はメールでURLを送信できるようにする（再編集パスワード：オプショナル）
  • localStorageで「いいね」を実装するのはアリかも
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

作画

  • 1. 明度・彩度を上げる（自動）
  • 2. 超解像で大きくする（自動）
  • 3. 遠近法で定サイズ矩形に切り抜く（手動：ここは仕方ない）
  • 4. バックグラウンドに貼り込む（自動）
  • 4.5 文字入れ（手動）
  • 5. 扱いやすいサイズにリサイズ（自動）（横700程度）
  • 6. GIMPで霧効果をかけて古びさせる（手動）or Script-Fu
  • 7 メタ情報を付加してデッキパッケージにする（手動）

画像処理手順

  • 【色-色相・彩度】
  • 青-20
  • 赤+10
  • 黄色-4
  • 【彩度】
  • 彩度80
  • 【色を透明度に】
  • サイズ1800*3600
  • 文字けし
  • pngで保存
  • （いったんここまで）
  • 紙に貼って
  • [文字入れ]
  • 霧茶色　深さ4.0 不透明度３０
  • 統合して
  • 明るさ＋２０
  • コントラスト＋２０

仕様

エクスポート機能が漏れていたので、フェーズ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を生成。

—

resource/environment.txt · 最終更新: 2024/12/22 06:25 by zzdcbowl
Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki