Second Life アバター全員で同じ動画を視聴する仕組み作り
Second Lifeの中でよくある動画再生の方法
動画再生する方法は4種類ある
Second Lifeの共有メディアはアバター毎に再生位置がずれる
- 該当の面にブラウザコントロールが読み込まれます。
- 設定しているURLのウェブページが読み込まれます。
- ウェブページ上の動画プレイヤーが動きます。自動再生やループが設定されていれば、再生や繰り返しがされます。
これでアバターが動画を見れますが、アバター毎に上記の処理が動きます。これでは動画のX秒目を再生しているといった時間軸の管理ができていません。
そのため、アバター毎に再生開始や再生位置が異なります。みんなで動画を見ながら、内容についてチャットしたり、ダンスすることが出来ません。
同時視聴ができる仕組み
プリムの構成
コントロールのプリムの役割
時間軸を管理していて、動画の開始、終了の指示を出します。タイマーを1秒刻みで動かしていて、動画の再生時間が動画時間が超えるなら停止や次の動画に切り替えます。
スクリーンのプリムの役割
コントロールのプリムとスクリーンのプリムの連携
スクリーン上の共有メディア面のウェブページ(YouTubeを再生する部分)
再生位置を同期して動画を同じタイミングにする方法
YouTubeの埋め込みプレイヤーの再生を制御するAPIがある
YouTubeの再生や制御する部分のHTMLファイルを用意する
YouTubeのURLを直接指定すると前述のAPIで操作できないです。適当なウェブスペースに以下の内容を含むHTMLファイルを用意します。
- YouTube動画プレイヤーの埋め込み
- JavaScriptの操作部分(YouTubeのAPIを使う部分)
- LSLから指示来た時の対応する仕組みの部分
コントロールプリムで時間軸をLSLのタイマーで管理する
コントロール部分でLSLの1秒ごとのタイマーと動画秒数を保持する変数を用意します。動画再生を始めたら、カウントします。
これでLSL側で「動画のX秒目」が分かります。スクリーン部分に対して毎秒毎に「動画のX秒目」という指示を出します。
LSLからYouTubeのseekToを操作する
スクリーンプリムのLSLからYouTube Player APIのplayer.seekTo関数を操作するため、通信部分が必要です。
シンプルにURLのハッシュ(#~) を使います。動的なサーバー(PHPとか)は不要で、HTMLとJavaScriptだけで作れるようになります。
LSLのタイマーで1秒ごとに共有メディアのURLを書き換えます。ハッシュ部分にseekというパラメータを用意して秒数を置いておきます。
(例)
URLのハッシュが変わったことはhashchangeイベントでキャッチできます。
hashchangeイベントがあったら、ハッシュにあるseekパラメータの秒数を取得します。YouTube埋め込みプレイヤー上の状態や再生位置を判定して、必要な処理をします。
以上の仕組みを使うことでアバター全員が同じ動画を視聴できるようになります。ぜひチャレンジしてみてください。
