夏も終わり間近というこのタイミングで今年最初のエントリになっちゃうんだけども、デスクトップ版Safariが5.1になったことで以前書いた「SafariとChromeを判別してみる」の方法が通用しなくなっちゃったのであわてて更新してみる。ほんとは中華パッド3号とか4号とかのこと書きたかったんだけども。

//

前回のおさらい

前回のアプローチは、SafariとChromeでwindow.constructorが違っている（SafariはObject、ChromeはDOMWindow）ことを利用してこんなアプローチをしてた。

// Safariはtrue、Chromeはfalseを返す関数
<script type="text/javascript">
window.check1 = function() {
  try {
    return window.constructor.prototype.alert == undefined;
  } catch(e) {
    // IEとかエラーでるし。
    alert(e.message || e.description);
  }
}
</script>

<button type="button" onclick="alert(check1())">check1</button>

// check1

ところが、Safari5.1からはwindow.constructorがDOMWindowConstructorとやらに変わっちゃったので、Chromeと判別されちゃう。さて、困りました。

Safari Developer Libraryを探したら

んで、急いでAppleのSafari Developer LibraryのDocument Additions Referenceでプロパティを確認したところ、「webkitCurrentFullScreenElement」「webkitFullScreenKeyboardInputAllowed」「webkitIsFullScreen」なんてのが見つかった。

念のためChromeのJavaScriptコンソールで「document.webkit」まで入力してタブキーで候補をさらってみたところ「Current〜」とか「FullScreen〜」、「Is〜」とかは表示されなかったのでなんとなくで「webkitIsFullScree」を採用することに決定。

ただし、プロパティの名前からしてbooleanを返すだろうから、単純に

!document.webkitIsFullScreen

なんて試しても判別がつかないので、undefinedかどうかをテストすることにして、こんな感じに。

<script type="text/javascript">
window.check2 = function() {
  try {
    return window.constructor.prototype.alert == undefined ||
           document.webkitIsFullScreen !== undefined;
  } catch(e) {
    return e.message || e.description;
  }
}
</script>

<button type="button" onclick="alert(check2())">check2</button>

// check2

で、こうなりました。

この変更を適用すると、こんな感じに。前回同様is_webkitとis_mobileの判定が出来る前提で。