桜の季節イベントも、今日で終わりですね。僕はちょっとリアルでゴタゴタしてまして、あまりインできてません💧

　さて、やっとこさHTML5 Playerが完成しました。これまでのFlash版では別窓で再生してましたが、今後はインラインで再生させようと思います。インラインって、再生中にページの移動ができなくなるので本当は好きじゃないんですけど。
　なお、これまで公開した動画については、これまで通り別窓で再生します。550本ほどあるので、1つ1つインライン化するのがめんどいという(苦笑)

　ちなみにTwitterカードにも対応しました。公式以外で対応しているクライアントが存在するのか否かは不明ですが、少なくとも公式ではこのように表示され……

　Twitter内で再生されます。

　それにしてもPlayer制作、大変でした。HTML5で動画や音声の扱いがお手軽になったとは言え、JavaScriptやCSSと組み合わせてちょっと複雑なことをやろうとすると再生環境によって挙動がバラバラ……。
　例えばiPhoneでの動画は、基本的にフルスクリーン再生(iOS10からは指定によりインライン再生可)。iPadはインライン再生。
　一方Androidは、実機を持っていないのでAndroid Studioをインストールしてエミュレーター上で動作チェックしたのですが(笑)、インライン再生だったりフルスクリーン再生だったり。バージョンによって異なるのかな？
　再生方式がバラバラな上に、なぜかAndroidの標準ブラウザで音声しか再生されないと思ったら、mp4のプロファイルが原因だったり。
　PC方面だと、IEが圧倒的に疫病神。古いバージョンではCSS3が使えなかったりするので、結局9以前は非対応としました。
　Safariだけ表示が乱れたりもしたなあ。友人のMacで確認したら問題なかったので、僕の使用してるグラボが原因のようですが。
　その他、細々としたバグが駆除しても駆除しても続々と湧き出る。「もう、YouTubeでいいかな……」と何度も心が折れそうになりました。

　そんなわけで、まだバグが潜んでいるかもしれません。「再生できないよ！」「なんか挙動が変だよ！」という方がいらっしゃいましたら、再生環境(OS、ブラウザ、それぞれのバージョン)など教えていただけると嬉しいです。

4/15/2018 13:09 マジカロス 桜の季節 イベント _Tweet