Youtube配信スイッチング「zappin’」
6月末から初めたDEAD BY DAYLIGHTで吊られまくってます。
コロナの影響でゲーム実況をはじめた芸能人も増え、日々Youtubeのゲーム実況動画を見てるのですがコラボされたときに一つのチャンネルしか見ていないと、他のチャンネルで盛り上がってるシーンを見逃す事が多々あります。
そこで2窓・3窓しても見やすいようなプレーヤーを作ってみました。
zappin’ – Youtube Live Switcher –
Youtube Data APIでトップページの「人気のライブ実況」を検索表示(5分以内はキャッシュしてます。)
視聴するページでは同じくYoutube Data APIで動画の情報を確認して実況中かを判断したりタイトルの抜き出しをした上で
YouTube Player APIでプレイヤーを用意してチャットをインラインフレームで並べています。
画面サイズの問題でPC向けには作っていたのですが一応タブレットやスマホでもChrome経由だとなんとか見れる場合もありますが負荷が大きいのでまともに動作しないかと思います。
Androidではチャットが表示されない場合は「PC版サイト」にチェックを入れると見れるかもしれません。
URLの追加の度にリロードしないようにJavascriptで追加できるようにしつつSNS等で伝えやすいように実況動画の追加削除をURLに反映しています。
チャット上のチャンネル名をクリックすると動画が切り替わりますが、内部でプレイヤーを2つ用意して切り替えた際に新しい動画の準備が整ったら切り替わるようになっていてプリロードのギリギリまで前の動画を視聴いただけるようになってます。
PCでは左に動画右にチャットの画面構成になりますが上の赤いバーを移動させる事で調整できます。
音声はそれぞれ設定を保存するようにしていますので一度設定するとチャンネルによって音のばらつきに悩まされる事も少なくなります。
あとGoogleのAPIの利用は有料化されてるので利用は制限させていただいております。
Tags: DBD, Google API, Youtube Live