ミニゲーム: 動画プレイヤー
概要
動画プレイヤーは、MiniExp 内でローカル動画ファイルと YouTube 動画の両方を再生できるユーティリティ系ミニゲームです。 再生準備・操作・完走・経過時間に応じて経験値 (EXP) が付与されるほか、最近視聴したソースを履歴として保持して再呼び出しできます。
画面構成
- ヘッダーパネル — 現在のソース種別、タイトル、動画長、再生ステータスを表示し、右上のバッジにセッション中の獲得 EXP 合計を表示します。
- ソース切り替えカード — 「ローカルファイル」「YouTube URL」のタブを切り替え、ファイル選択・URL 入力・読み込みボタン・補足メッセージをまとめています。下部には処理結果を示すメッセージバナーが表示されます。
- プレイヤー領域 — HTML5 <video> 要素または YouTube IFrame/API プレイヤーを埋め込み、下部に状態テキストを表示します。何も選択していない場合はプレースホルダーが表示されます。
- 右サイドカラム — 最新 5 件の視聴履歴リストとショートカット／ヒント一覧で構成され、履歴のクリアボタンもここにあります。
対応ソースと読み込み手順
ローカルファイル
- 「ローカルファイル」タブを選択して
video/*を受け付けるファイル選択フォームを開きます。 - MP4・WebM・Ogg などブラウザが再生可能なファイルを選ぶと即座に Object URL が生成され、HTML5 プレイヤーが表示されます。
- メタデータ読み込み後に動画長が情報パネルへ反映され、「ローカル動画を読み込みました」というステータスとメッセージが表示されます。
ファイル選択に失敗した場合は「動画ファイルを選択してください」というエラーメッセージが表示され、読み込みエラー時には再生領域が初期化されます。
YouTube
- 「YouTube URL」タブで URL または動画 ID を入力します。
youtu.be/、watch?v=、/embed/形式に対応し、ID 文字列のみでも読み取ります。 - 「読み込み」ボタン、または入力欄で Enter キーを押すとプレイヤーが起動し、プレースホルダーのタイトルが表示された状態で読み込みが進みます。
- 利用環境で IFrame API が利用可能な場合は YouTube Player API を使ったプレイヤーが生成され、準備完了後に正式タイトルと動画長を取得して表示します。
- API が利用できない／読み込みに失敗した場合は自動的に簡易モード (単純な埋め込み iframe) に切り替わり、その旨のメッセージが表示されます。
無効な URL や ID の場合は「有効な YouTube URL または動画IDを入力してください。」とエラーバナーに表示されます。
再生操作とステータス
- ローカル動画は HTML5 標準のコントロールに加え、プレイヤーが Space で再生/一時停止、←/→ で ±5 秒のシークを受け付けます。
- YouTube API モードでも同じキーボードショートカットが有効です。簡易モードでは YouTube 側ショートカットを利用してください。
- ステータス表示は「再生中」「一時停止」「再生完了」「バッファリング中」などプレイヤーから取得した状態を反映します。YouTube API でエラーが発生すると「YouTube プレイヤーエラー」が表示されます。
- プレイヤー停止またはソース切り替え時には内部状態がリセットされ、プレースホルダー表示に戻ります。
EXP 獲得ルール
| トリガー | 条件 | EXP |
|---|---|---|
| 読み込み完了 | ローカル動画をロード | +5 |
| 読み込み完了 | YouTube 動画をロード（API/簡易モード共通） | +3 |
| 履歴リプレイ | 履歴から再生した場合の追加ボーナス | +2 |
| 再生開始 | 初回の再生ボタン操作（ソース別に一度だけ） | +1 |
| 再生完了 | 動画を最後まで再生（ソース別に一度だけ） | +8 |
| 視聴進捗 | 60 秒ぶん視聴するごと（連続で加算） | +1 |
EXP はセッション内でリアルタイムに加算され、上部バッジとホスト側の共通 EXP システムへ反映されます。再生を停止すると内部カウンターがリセットされますが、履歴は保持されます。
視聴履歴
- 最新順で最大 20 件までをブラウザの
localStorage(mini_video_history_v1) に保存し、画面右側では最新 5 件まで表示します。 - ローカル動画はファイルパスを保存できないため、履歴ボタンを押すと再選択ダイアログが開きます。同じファイルを選ぶと自動的に履歴再生扱いとなり、ボーナス EXP が付与されます。
- YouTube 動画は元の URL が記録され、履歴ボタンで即時に再ロードされます。
- 「履歴をクリア」ボタンで保存データを消去し、完了メッセージがバナーに表示されます。
ショートカットとヒント
- Space：再生 / 一時停止（ローカル動画、および API 利用時の YouTube）
- ← / →：5 秒単位でシーク（同上）
- 履歴をクリックして素早く再視聴できます。ローカル動画はファイル再選択が必要です。
- YouTube 簡易モードでは YouTube 側のショートカット（K/J/L など）をご利用ください。
エラーとフォールバック
- ファイル読み込みエラーや YouTube 読み込みエラーは赤色のメッセージで通知され、ステータスにも反映されます。
- YouTube IFrame API の初期化には 8 秒のタイムアウトが設定されており、読み込めなかった場合は簡易モードへ切り替わります。
- タブ切り替えや停止操作を行うと、各ソースのプレイヤーリソース（Object URL や YouTube Player）が破棄され、不要なメモリ使用やバックグラウンド再生を防ぎます。