ツイキャスヲッチャーってのを作ってみた


 最初はKDPランキングの表示部分をbootstrapで作り替えようとしていたのだけれども
やっているうちに見た目は綺麗になるものの、既にレスポンシブ化のためのメディアクエリーなども含め諸々調整済みだったので
新たに可能になる要素がなんもねえなと思って、bootstrap使って別のものを新たに作ろうかなと思った。


 丁度1カラムのテンプレートをいじっていたので、左側に画像なり動画なりを埋め込めるといいなと思って調べてみたところ、
ツイキャスAPIがあったので早速使ってみた。


 ツイキャスAPIからJSONデータを取得し、そこからユーザーIDをもってくると、
そのまま埋め込みプレイヤーのURLをそのユーザIDに書き換えるだけでその動画を埋め込めるのではないかと思って試したところ
上手くいった。


 で、公開して寝たのだが、朝起きてみるとスマホだと動画がでてないなと。
Flash10が最近のスマホでは入っていないらしいのだ。ツイキャスをやるのは若い層だけだろうから
スマホでみれないとあんまり意味がない。
公式サイトだとJavascriptでユーザーエージェントからブラウザを判定し、ChromeApple系のブラウザにはHTML5で再生するようにしているようだった。
そのHTML5での埋め込み方も公式ガイドにでていたので、PHPでブラウザを判定して同様にChromeApple系のブラウザにはHTML5で再生するように切り替えロジックをいれた。


 その他、再生前の表示画像を動画の静止画像に差し替えたりあまり大したことない事をゴニョゴニョやって公開してあります。
http://kdp.url.ph/twicas/