このツール群は、お使いのコンピュータ上で直接動作する、ブラウザで使えるローカル完結のStatic Web Appコレクションです。サーバ不要で、各ツールは単一HTMLで完結して動作します。基本の流れは「入力 → 生成 → (必要に応じて)実行結果貼り付け → 次のステップの生成」で、画面要素は上から下へ流れに沿って並びます。ツールによっては「入力 → 生成」だけで完結します。

各ツール(HTMLファイル)をウェブブラウザで開くと、専用の入力画面が表示されます。そこに必要な情報を入力するだけで、用途に応じたテキストや結果が自動的に作成されます。

• MD3リファレンス
• GitツールREADME
• PasswordツールREADME
• Musicビルドプロセス

• FFmpeg向けツールで生成されたコマンドを実行するには、お使いのコンピュータに FFmpeg がインストールされている必要があります。
• Japan Weather は天気情報の取得で外部と通信します(オンライン取得)。

• ローカル動作: お使いのPC内で動作し、サーバは不要です。
• 簡単な操作: ウェブブラウザでファイルを開き、情報を入力するだけで結果が手に入ります。
• 1HTML完結: ツールごとに単一HTMLで完結し、配布や保守が簡単です。
• 完全オフライン化: CSSやJavaScriptライブラリは必要最小限に留め、外部CDNへの依存をベンダリング(自前実装)で排除しています。
• UIルール: 必須項目は赤い*、説明は?に集約、ボタン色は生成=緑/反映=青で統一します。

つまり、「ウェブブラウザで動く、ローカルHTMLツール集」と言えます。

• ブラウザでHTMLを開いてフォーム入力すると、用途に応じたテキストや結果を生成
• 基本はローカル動作で、インターネット接続は不要(※(注記)一部ツールはオンライン取得あり)
• Static Web App(静的HTML/CSS/JSのみ)として構成され、サーバは不要
• 各ツールは単一HTMLで完結して動作
• ただし docs/music/ は保守性確保のため「分割ソースをビルドして単一HTMLを生成」する例外運用を採用
• 基本の流れ:「入力 → 生成 → (必要に応じて)実行結果貼り付け → 次のステップの生成」で、画面要素は上から下へ流れに沿って並ぶ
• ツールによっては「入力 → 生成」だけで完結するものもある
• ベンダリング: CSSフレームワークなどの外部CDN依存をできる限り排除し、必要な機能は自前で実装して完全オフライン化を実現しています
• 仕様書の命名: 各 *.html に対応する仕様書は同一ディレクトリに *-spec.md で配置する(例: git-pseudo-squash.html ↔ git-pseudo-squash-spec.md)

• ボタン色: コマンド生成は緑、解析結果の反映は青(用途別に統一)
• 必須項目: 赤いアスタリスク(*)で示す
• 説明: 「?」のツールチップにまとめる
• タイトル説明の運用: 各HTMLのタイトル右に「?」の説明を置く方針にし、その文言を docs/index.html のホバー説明へ転記する

docs/
├── index.html # トップページ(ツール一覧へのリンク)
├── diagram/ # 図表系ツール
├── music/ # 楽譜変換系ツール
│ ├── *-src.html # music向け開発テンプレート(手編集対象)
│ ├── *.html # music向け配布用生成物(手編集しない)
│ └── src/ # music向け分割ソース(css/ts/js)
├── ffmpeg/ # FFmpegおよび周辺ツール
├── git/ # Git補助ツール
├── grep/ # 検索補助ツール
├── img/ # 画像系ツール
├── text/ # テキスト系ツール
├── life/ # 生活系ツール
├── link/ # URL加工系ツール
└── password/ # パスワード生成ツール

• 対象: docs/music/ 配下
• 配布: *.html(単一HTML、生成物)
• 開発: *-src.html + src/css/*.css + src/ts/*.ts + src/js/*.js
• ビルド: npm run build:music(scripts/build-music.mjs)
• 型チェック: npm run typecheck:music(typescript 導入後)
• ルール:
  • *.html は直接編集しない
  • 変更は *-src.html と src/ を編集する
  • PRには生成済み *.html を含める

• docs/index.html の「更新日」を忘れずに更新する
• docs/index.html の「最終更新日時(更新日)」を忘れずに更新する
• PRテキスト作成は「特定のコミット以降の全変更」を求められる前提でまとめる
  • 例:「<コミット> 以降の変更内容全てのための PRテキスト」
• PRテキストの基本構成は「タイトル / 概要 / 変更点 / 影響」で統一する
• 開発フローは「変更 → 動作/見た目を確認 → LGTMが出たらコミット」を基本とする

• 変更確認時は、必ず「手元のローカルファイル」を開いていることを確認する
• GitHub Pages 公開版(https://igapyon.github.io/local-html-tools/)と、ローカル作業中の画面を混同しない
• 見た目確認の前に、ブラウザのURLがローカルファイル(file://.../docs/index.html など)かを毎回チェックする
• 公開版と比較する場合は、タブ名やウィンドウを分けて明示的に見分ける

• GitHub CLI不使用: gh コマンドは使用しないでください。Bash の git コマンドで対応してください
• ユーザーが LGTM と明示した変更は、追加確認を挟まず commit まで進める
• このプロジェクトを編集・拡張する際は、上記の基本方針、UI設計ルール、構成、PRルールに従ってください

FFmpegのコマンドラインを生成するツールです。コマンド主体に見えますが、実際は「順を追って実行 → 結果を貼り付け → 次のコマンドを生成」というユースケースの流れに沿って設計されています。

• ffmpeg-concat-cmdline-gen.html: 複数の.wavファイルを結合するためのコマンドを生成します。
• ffmpeg-loudnorm-cmdline-gen.html: ラウドネス測定結果を基に、ハイレゾ対応やモード切り替えを含んだ正規化コマンドを生成します。
• ffmpeg-trim-cmdline-gen.html: 音声/動画ファイルを切り出すためのコマンドを生成します。
• ffmpeg-audio-convert-cmdline-gen.html: 音声ファイルを指定の形式に変換するコマンドを生成します。
• ffmpeg-youtube-mkv-gen.html: .wav音声ファイルと静止画から、YouTube向けの動画(.mkv)コマンドを生成します。
• ffmpeg-mp4-to-wav-gen.html: .mp4ファイルから音声をWAVとして取り出すコマンドを生成します。
• ffmpeg-replace-audio-with-wav-gen.html: .mp4動画の音声をWAVに差し替えるコマンドを生成します。
• ffmpeg-silence-detect-gen.html: 無音区間検出のためのコマンドを生成します。

URL加工系ツールです。

• amazon-dp-extract.html: Amazon URL から dp/ASIN を抽出します。
• facebook-fbclid-remove.html: URL から Facebook識別子(fbclid)を除去します。
• url-encode-decode.html: URLのエンコードとデコードを行います。
• mime-base64.html: MIME Base64のエンコードとデコードを行います。
• utm-remove.html: URL から utm_* パラメータを削除します。

パスワード生成ツールです。

• password-gen.html: 選択した文字種と文字数でパスワードを生成します。

検索補助ツールです。

• find-gen.html: findコマンドの検索条件を生成します。

画像系ツールです。

• img2svg.html: 画像ファイルをSVGに変換してダウンロードします。

図表系ツールです。

• mermaid-to-svg.html: Mermaid記法からSVGを生成し、SVGを保存します。
• graphviz-dot-to-svg.html: Graphviz DOT記法からSVGを生成し、SVGを保存します。

楽譜変換系ツールです。

• musicxml-to-svg.html: MusicXMLから楽譜SVGを生成し、SVGを保存します。
• musicxml-to-abc.html: MusicXMLをABC記法へ変換し、ABCを保存します。
• abc-to-musicxml.html: ABC記法をMusicXMLへ変換し、MusicXMLを保存します。
• musicxml-to-midi.html: MusicXMLをMIDIへ変換し、.midを保存します。

テキスト系ツールです。

• text-viewer.html: テキストをペーストして、読みやすく表示します。マークダウン形式にも対応しています。
• text-processing.html: 改行付きテキストを半角空白区切りに変換します。

生活系ツールです。

• forgot-items-check.html: 忘れ物チェック用のリストを生成します。
• japan-weather.html: 日本の天気情報(地域別)を確認できます(オンライン取得)。

Git補助ツールです。

• コマンドから入るのではなく、まずユースケース(やりたいこと)を明確化し、流れに沿って必要なコマンドを並べる方針です。
• git-pseudo-squash.html: reset --soft で疑似的に1コミット化するコマンドを生成します。複数行のコミットメッセージに対応し、内容は一時ファイルに書き込んで git commit -F で渡します。
• git-branch-diff.html: ブランチ差分コマンドを生成します。
• git-config-setup.html: Gitのユーザー名とメールアドレスを設定するコマンドを生成します。
• git-config-advanced-setup.html: core.autocrlfやpush.defaultなどの詳細設定をコマンドで生成します。

GitHub Pages で公開する場合は docs/index.html が入口になります。ツール本体は docs/diagram/、docs/music/、docs/ffmpeg/、docs/git/、docs/link/、docs/password/、docs/grep/、docs/img/、docs/text/、docs/life/ 配下にあります。
公開URL: https://igapyon.github.io/local-html-tools/

本プロジェクトで利用しているサードパーティソフトウェアとライセンスは THIRD_PARTY_NOTICES.md に記載しています。

本リポジトリのライセンスは LICENSE を参照してください。

本プロジェクトは複数カテゴリのツールで構成されており、Diagram、FFmpeg、Git、リンク管理、パスワード、grep、画像、生活系などが並列に含まれます。FFmpeg 系ツールはその一部です。