Comfort Movie

動画を最大画面で集中して視聴するためのChrome拡張機能です。

動画サイト閲覧時によくある問題を解決します。画面上の広告やコメント欄などが動画の邪魔になったり、意図せずマウスを動かしてしまい動画コントロールが表示されて集中が途切れたりする経験は多くの人にあるでしょう。この拡張機能は、動画を画面いっぱいに表示し、必要なときだけコントロールを表示することで、快適な視聴環境を提供します。

主な機能

動画の全画面表示 動画をブラウザウィンドウ全体に拡大して表示します。元の縦横比は保持されるため、動画が歪んで見えることはありません。ウィンドウサイズに応じて動画サイズが自動調整されます。

スマートなコントロール表示制御 通常の状態では、マウスカーソルが動画上にあっても動画コントロール（再生バー、音量調整など）は表示されません。コントロールを使用したい場合は、動画下部20%の領域にマウスを2秒間置くか、同領域をクリックすることで表示されます。コントロールは動画から離れて3秒経過すると自動的に非表示になります。

確実な前面表示 z-indexの制御により、ページ上の他の要素（広告、ポップアップ、サイドバーなど）が動画の前に表示されることを防ぎます。

直感的な操作 拡張機能の開始は右クリックメニューまたは拡張機能アイコンから行えます。終了はESCキー、右下の終了ボタン、または再度右クリックメニューから選択できます。

インストール手順

推奨: ビルド済みパッケージを使用

1. リリースページから comfort-movie-extension.zip をダウンロード
2. ダウンロードしたファイルを任意の場所に展開
3. Chromeブラウザで chrome://extensions/ を開く
4. 右上の「デベロッパーモード」をオンに切り替え
5. 「パッケージ化されていない拡張機能を読み込む」ボタンをクリック
6. 手順2で展開したフォルダを選択

開発者向け: ソースからビルド

git clone https://github.com/TomoTom0/ComfortableMovie.git
cd ComfortableMovie
npm install
npm run build

その後、Chromeの拡張機能ページで dist フォルダを読み込んでください。

基本的な使い方

1. 快適モードの開始: 動画が表示されているページで右クリックし、「快適動画モードを切り替え」を選択するか、ツールバーの拡張機能アイコンをクリック

2. 動画コントロールの表示: 動画下部にマウスを2秒間置く、または動画下部をクリック

3. 快適モードの終了: ESCキーを押す、または画面右下の「×」ボタンをクリック

技術的特徴

この拡張機能は以下の技術を使用して実装されています：

• TypeScript: コードの品質と保守性を向上
• Chrome Extension Manifest V3: 最新のセキュリティ基準に準拠
• CSS pointer-events制御: :not() セレクタを活用した効率的なマウスイベント管理
• 動的z-index管理: 他の要素との表示順序を確実に制御
• レスポンシブ対応: ウィンドウリサイズ時の自動調整

対応サイト

YouTube、ニコニコ動画、Vimeo、その他HTML5動画プレーヤーを使用するほぼすべてのサイトで動作します。

ライセンス

MIT License - 詳細は LICENSE ファイルをご覧ください。