突然ですが皆様、「二窓」という言葉をご存知でしょうか。

これは主にニコニコ動画界隈で聞かれる用語で、意味合いとしては「二つの動画を同時再生して、混ざり合う音声を楽しむ手法」のコト。

ニコニコ動画の中でも特に、初音ミクをはじめとしたボーカロイドにオリジナル曲を歌わせた「本家」と、その曲を実際に「歌ってみた」モノの二窓が人気で、「sm●●●●●●●●（動画のID）との二窓がヤバイｗｗｗ」「オリジナルとの二窓推奨」といったコメントも実際ちらほら見かけたりします。

しかし、ワタクシの知る限りではありますが、今までこの「二窓」を楽しむには、文字通り二つのウィンドウやタブを使って動画を再生しつつ、それぞれを行き来しながら曲のタイミングを合わせていく、といった面倒かつ難しい作業が要求され、やっとタイミングが合ったと思ったらもう曲の中盤、みたいなコトも。

なので作ってみました。二窓を楽しむためのwebサービス「二窓無双」！！

コトの発端にも係わらず、残念ながらニコニコ動画のURLには対応する方法が分からなかったので、フツーにYouTubeの動画URLにだけ対応としました。

以下、「二窓無双」のカンタンな使い方など、僭越ながらご紹介させていただきますっ！

「二窓無双」について

使い方に関して

まず、なにはともあれ二窓無双のページに行ってみてください☆

二つのYouTube動画プレイヤーの上にあるのが、URLを入力するフォームです。

右と左それぞれのフォームに二窓で聞きたい動画URLを入力したら、今度は動画プレイヤー下の「上記の動画を二窓する」と書かれたボタンをクリックしてください。

すると自動的にURLから動画を引っ張ってきてセットされますので、「上記の動画を二窓する」ボタンの下にある「PLAY」ボタンをクリック！

両方の動画プレイヤーが同時に読み込みを開始し、ローディングが完了し次第、再生が開始されます。

ここで注意その１！

時間帯や環境などで、片方だけ読み込みが遅かったり両方とも読み込みが遅い場合があったりしますので、その場合は気長にお待ち下さいな♪

そんなこんなで無事に両方とモノ動画が再生されたら、「PLAY」ボタンの隣にある「REWIND」ボタンを押すと、両プレイヤー同時に頭出し+自動再生されます。

ここで注意その２！

ここでタイミングがバッチリ合ってたらラッキーですが、もし左右で微妙にズレてたら、動画プレイヤー本体の一時停止ボタンを一瞬だけ使って、一時停止→再生でタイミングを微調整していきます（要はダブルクリックの要領）。

ちなみにもし左右どっちの動画が先に始まっているのかを判別したい場合は、どちらかの動画プレイヤーだけボリュームを下げてみると分かりやすいかと。

使い方はこれだけ！あとは好きなようにお楽しみ下さいな☆

技術的な部分に関して

続いては技術的な側面、特にJavaScriptとPHPについてのお話ですが、ほぼ大したコトはしてません。

というのも、最初は「ニコニコ動画」と「YouTube」の２サイトの動画を同時に扱おうとしたのですが、そうするとちょっと同時再生用プレイヤーを作るのが難しそうだったので、YouTubeのみに対応するコトにした結果、YouTuneのAPIをそのまんま使えたからです。

YouTubeのAPIに関しては本家をはじめ様々なトコで詳細に解説がされていたので、特に問題なく理解を進められました。

で、一番重要な「同時再生用プレイヤー」の部分に関しても、「■ 音楽方丈記 ■」というサイトさんの「JavaScriptでYouTubeを操作するテスト (1つのボタンで2つの動画を同時再生) 」という記事にて、かなり直接的な情報をGET出来ましたので、二窓無双もこの記事を基に、ところどころスクリプトを簡略化したりして完成させました。というかほとんど流用レベルです。本当にありがとうございました。

そして動画URLの文字列をプレイヤー用JavaScriptに渡す部分のPHPですが、こっちはもっとカンタンで、入力された値（URL）から必要な動画ID部分だけ抜き出して、JavaScriptの該当部にソレを上書きする、って流れです。

具体的には、入力された文字列から不要な部分を正規表現で置換（＝preg_replace）して、いちおーイタズラに備えて危険なタグ等を書き換え（＝htmlspecialchars）して、ってくらいです。

あと、入力フォーム部分にしれっとjQuery使ってて、デフォルトの「ここにYouTubeの動画URLを入力してください。」って文章が、フォーカスされたら消えるって挙動を実現させてます。

「二窓無双」使用に関する諸注意

当サービス「二窓無双」はオープンソースではありませんが、完全に無料で使用できるサービスになります。

MITライセンスなんかで見かける文言ではありますが、当サービスを利用したことによる、いかなる請求・損害・その他の義務について、何らの責任も負わないものとしますので、ご利用は自己責任の上でお願い致します。

また、もしバグや改善点などありましたら、お気軽にご教示くださいませm(_ _)m

それでは、ごゆるりとお楽しみ下さい～♪

二窓無双 | 二つの動画の同時再生「二窓」のための無料webサービス