[ブラウザ拡張機能] チューブで踊るお🐟リスト: サポートページ
👇マウスとかタップで触ると。。
「踊ってみた」ライブ配信などでユーチューブのビデオクリップ動画を流しながら踊るのに便利かもしれないブラウザ拡張機能
『チューブで踊るお🐟リスト
』
を作ってみました。
主な機能としては事前に登録しておいたYouTubeの動画をリストから選択して、ブラウザ上で順番に再生していく事が出来ます。
動画の再生前に秒単位でインターバル (待ち時間) を設定出来るので、リモコンが無い環境でも、再生ボタンを押してインターバル中に踊る位置に移動という使い方も出来ると思います (当方では実戦テストはしていません。。)。
インストール
Chrome拡張機能
Menifest v3版のChrome拡張機能をv0.2.xとしてchrome ウェブストアで公開になっています。
📦チューブで踊るお🐟リスト v0.2.3
( 公開)
新規でインストールした場合、「再生リスト」と「マイリスト」に、既にいくつかのビデオクリップ動画が登録されていますが、例として登録してあるだけなので、(4)の「リスト編集用ボタン」を使って削除するなりと編集した後、「全て保存」ボタンをクリックすると今後のブラウザー起動時に反映される様になります。 (因みに、登録されている曲は、実際に踊ってみた配信をしている「お🐟さん」の選曲を一部参考にしています。)
Firefox アドイン
Firefoxブラウザは、標準設定だと新しいタブで読み込んだ動画の自動再生を無効にする仕様になっているので、標準設定になっていると拡張機能を使ってもフレーム組み込みプレーヤーAPIに非対応の動画を自動再生する事が出来ません。
設定を変更すると自動再生の有効化も可能 (📃mozillaサポート) みたいですが、特定のサイト限定ではなく、全サイトに対して有効になるみたいなのと、Firefoxで使いたいという要望も少ないと予想するでの、現時点ではFirefoxアドインとしてのリリースは見合わせています。
追記
最近のFirefoxではサイト別に動画の自動再生を指定出来る様になっています。
主な機能
- YouTubeの動画の再生
- 再生前の秒単位のカウントダウン (インターバル)
- 拡張機能内でのプレイリストの管理
- プレイリストに動画URLと情報の追加/削除
- 動画のURLからクリップの情報を取得
- プレイリストの曲順の変更
- プレイリストの保存と読み込み
をクリックすると下の様なメイン操作画面が開きます。
(1) ビデオプレーヤー
ここに再生中のYouTube動画が表示されますが、再生中、プレーヤ内の右下に表示されるYouTubeの ボタンをクリックすると全画面表示に切り替える事も可能です。
動画の表示にはYouTubeのIFrame player APIを使っていますが、一部の動画はこのAPIでの再生に対応していない様なので、(同じブラウザ上の) 別のタブで開くYouTubeのページで再生する仕様になっています。
v0.2.xではChrome拡張機能の使用の変更により、このビデオプレーヤーが無効になっています。
※ 初回リリースバージョンのv0.1では別のタブで再生される動画の自動再生には対応していないので、ビデオプレーヤー内に「 動画を再生できません」という警告が表示された場合は、その下の「YouTubeで見る」をクリックして、指定した動画を別のタブで開いて再生する必要があります。
今後のバージョンでそういった動画の自動再生にも対応する予定です。
バージョン0.1.1以降からIFrama player APIに対応していない動画も別のタブで開く事によって自動再生に対応しています。
[追記]
別のタブで開く場合は、動画の再生の前後に広告が再生される場合もありますが、「広告をスキップ」のボタンが表示された時点で残りの広告をスキップする仕様になっています。
でも、場合によっては上手くスキップされない場合もあるので、今後共、スキップ機能の改善に努めて行きたいと思っています (広告を全てスキップという仕様ではありません、念の為)。
再生モード選択用スライドスイッチ
クリックでビデオプレーヤの二つの再生モード、「リスト再生モード」か、「シングル再生モード」を切り替える事が出来ます。 |
リスト再生モード
このモードが選択されている状態で、 ボタンをクリックすると(3)の「再生リスト」に表示されている動画が順番に再生されます。
又、(3)の「再生リスト」内の動画の行をダブルクリックした場合は、再生モードがリスト再生モードに切り替わって、ダブルクリックした行から順番に再生されます。
再生中の動画の行の背景は水色のハイライト表示されます。
[注] (5)の「マイリスト」内の動画はこのモードに対応していないので(4)のリスト編集用ボタンを操作して「再生リスト」にコピーする必要があります。
シングル再生モード
このモードが選択されている状態では、一曲だけの再生になります。 既にビデオプレーヤーに動画が読み込まれている場合は、 をクリックするとその動画が1回だけ再生されます。
又、(3)の「再生リスト」か、(5)の「マイリスト」に表示されている動画を再生したい場合は、右端に表示されるマークをクリックすると、その動画の再生が、可能であれば、(1)のビデオプレーヤーで再生されます。
因みに、左横のマークをクリックすると、ビデオクリックが拡張機能のページとは違う別のタブでYouTubeのページとして再生されます。
再生リストの選択と編集
この拡張機能では、複数の再生リストを扱える仕様になっていますが、「再生リスト」のタイトルの右横に表示される、濃い水色の長方形内 ⏷に選択済みの再生リストの名前が表示されます。 この長方形をクリックすると、次の例の様に右方向にツールバーと、下方向に登録されている再生リストの名前が展開します。
下方向に展開するリスト名を選択する事で、選択したリストの内容がタイトルの下の表に表示されます。
再生リスト編集用のツールバー
| 名変更ボタン: 再生リストの名前を変更。 クリックすると新しい名前を入力する欄が表示されます。 | |
| 削除ボタン: 再生リストを削除。 | |
| 新規追加ボタン: 新しい空の再生リストを追加。 クリックすると新しい再生リストの名前を入力する欄が表示されます。 | |
| エクスポートボタン: 再生リストをJSONフォーマットのテキストとしてクリップボードにコピー。 |
再生リストの名前はツールバーのボタンで編集出来ますが、他のリストと重複する名前の登録はできません。
(4) リスト編集用ボタン
(3)の再生リストと(5)のマイリストに登録されている動画を、行の左端にあるチェックボックスで選択しでリスト間での移動や、削除、編集が出来ます。
次のボタンで操作が選べますが、チェックボックスで選択した動画の数や、どのリスト(「再生リスト」か「マイリスト」か)の動画を選択するかによって無効化されるボタンもあります。
| 下のリストで選択した動画を上のリストにコピー (「マイリスト」のチェックボックスを選択した場合のみ有効、複数選択可) |
|
| 上のリストで選択した動画を下のリストに移動 (「再生リスト」のチェックボックス選択した場合のみ有効、複数選択可) |
|
| 選択した動画を削除 (複数選択可) |
|
| 選択した動画を編集 (「マイリスト」のチェックボックスを一つのみ有効) |
|
| 全て保存 |
左端のチェックボックスは上の見出しにあるボタンでまとめて操作する事も出来ます。
| 同じリスト内の動画の選択を解除。 |
|
| 同じリスト内の動画を全て選択。 |
|
| 同じリスト内の動画の選択の反転。 (チェックボックスが選択されていない状態では表示されません。) |
|
| 選択を元に戻す。 (チェックボックスが選択されていない状態では表示されません。) |
※ 各リスト内の行は、行内の文字をハイライトした後に、下の動画の様にドラッグ&ドロップで行の順番を変更出来る様になっています。
(5) マイリスト
「マイリスト」での動画の操作は「再生リスト」とほぼ同じですが、タイトルの左右に、次の二つの操作ボタンが追加されています。
| JSONフォーマットのテキストを新しいマイリストとして追加。 | |
| 表示中のマイリストにYouTubeの動画を追加。 |
JSONフォーマットのテキストを追加
このボタンをクリックすると、(2)の「メディア再生コントロール」より下が「JSONテキストから追加」というタイトルの表示に切り替わります。 タイトルの下にJSONフォーマットのテキストを入力なりペーストした後に「変換」ボタンをクリックすると下のリストに認識されたクリップの情報が表示されます。
再生リスト/マイリスト編集用のツールバーにある「エクスポートボタン」でクリップボードにコピーしたリストをテキストファイルとしてバックアップ保存をしておけば、後日、この方法でリストを読み込み直す事もできます。
JSONフォーマットのテキストの例はこちらを 👉「踊るお🐟リスト用 JSON-リスト (2021年)」
YouTubeの動画を追加
このボタンをクリックすると、(2)の「メディア再生コントロール」より下が「新規登録」というタイトルの表示に切り替わります。
YouTube動画のURLを入力した後に「確認」ボタンを押すとインターネット経由で動画の情報が読み込まれます。
「OK」ボタンをクリックすると新しい動画がマイリストの一番下に追加されます。
確認されている問題/事例
- 「マイリスト」のボタンで、YouTubeの動画を追加する再、YouTubeのIFrame player APIに対応していない動画の場合は「確認」ボタンをクリックしても動画の情報が読み込まれない。
- バージョン0.0.1でマークでYouTubeのIFrame player APIに対応していない動画を別のタブで開いた場合、リスト再生モードになっていると、動画終了後にリスト再生が開始してしまう。
- リスト内の行のドラッグ&ドロップの際、行の一部をハイライトしてハイライト部をドラッグ&ドロップする必要がある。
更新履歴
チューブで踊るお🐟リスト v0.2.x
| Chrome 拡張機能 |
更新内容 |
| v0.2.3 ( 公開) |
|
| v0.2.2 ( 公開) |
|
| v0.2.1 ( 公開) |
|
| v0.2.0 ( 公開) |
Manifest v3版。
|
| v0.1.2 ( 公開) |
|
チューブで踊るお🐟リスト v0.1.x
| Chrome 拡張機能 |
更新内容 |
| v0.1.1 ( 公開) |
|
| v0.1 ( 公開) |
初回リリース |
コメント
コメントを投稿