モバイル環境でのvideo.js-dailymotionのバグについて
久しぶりの記事ということで軽く
ある案件でフリーのプレイヤーフレームワークのvideo.jsを利用してるのですが、そこでdailymotionの動画を取り込みたいということでvideo.js-dailymotionというプラグインを使っている。
しかし、モバイル環境で動かすとなぜかシークバーが出てこないバグが発生することが分かったんですね。それだと動画を止められないっていうことで直すことに。。。
いきなり答えから申しますと
if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)) { var ieVersion = Number(RegExp.$1); this.addIframeBlocker(ieVersion); } else if (!/(iPad|iPhone|iPod|Android)/g.test(navigator.userAgent)) { // the pointer-events: none block the mobile player this.el_.className += ' onDesktop'; this.addIframeBlocker(); }
これが問題のコードで、これはaddIframeBlocker()を呼び出しているわけだが、なぜかUAがモバイルだと条件的に呼び出されていない!
これは製作者の故意なのかミスなのか、わからないが修正しても動くので問題ないということで
修正版
if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)) { var ieVersion = Number(RegExp.$1); this.addIframeBlocker(ieVersion); } else if (!/(iPad|iPhone|iPod|Android)/g.test(navigator.userAgent)) { // the pointer-events: none block the mobile player this.el_.className += ' onDesktop'; this.addIframeBlocker(); }else{ this.addIframeBlocker(); }
と、まあこのように修正してみた。
しっかりシークバーも出るようになり他のバグもでていないので良しとしよう。