window.xconfig の修正

uupaa.js 0.7 の修正履歴です。興味がない方は読み飛ばしてください。

window.xconfig を定義すると大まかな挙動を設定できる

window.xconfig を uupaa.js ロード前に定義すると、大まかな挙動を設定できます。
現在のところ、以下の設定項目があります(変更適用後のものです)

<script>
window.xconfig = {
  aria: 0,        // @param Number(= 0): 1 is enable WAI-ARIA
  debug: 0,       // @param Number(= 0): 1 is debug mode, 0 is normal mode
  light: 1,       // @param Number(= 1): 1 is light weight mode
  altcss: 0,      // @param Number/Function(= 0): altcss mode
                  //                     0 is auto, callback function
  consel: 0,      // @param Number(= 1): 1 is enable conditional selector
  cssexpr: 0,     // @param Number(= 0): 1 is enable css-expression, 0 is disable
  imgdir: "img",  // @param String(= "img"): image dir
  visited: 0      // @param Number(= 0): 1 is E:visited activate
};
</script>
<script src="uupaa.0.7.js"></script>
<script>
function xboot(uu) {
  ....
}
</script>

さきほど、以下の変更を行いました

  • window.xconfig.css3maxmin 削除し、window.xconfig.cssexpr を追加
  • window.xconfig.css3markup を window.xconfig.altcss に名前を変更
    • 値には 0 または、配列を返す関数を設定できます

window.xconfig.altcss に関数を設定できるようになったので、「Google Chrome2+, Safari4+, Firefox3.5+ なら、ブラウザがネイティブに実装している CSS3 の機能を使いたいので、altcss を OFF にしたい」 といった場合に、以下のように書けます。

<style>
html.ifadvanced .dropshadow { /* Advanced Browser 用のスタイル */
 -webkit-box-shadow: ... /* ブラウザの機能で box-shadow をレンダリング */
 -moz-box-shadow: ...
}
html.ifclassic .dropshadow { /* Classic Browser(非 Advanced Browser)用のスタイル */
 -uu-box-shadow: ...    /* altcss の機能で box-shadow をレンダリング */
}
</style>
<script>
window.xconfig = {
  altcss: function(uu) {
    if (uu.ver.advanced) { // uu.ver.advanced は Google Chrome2+, Safari4+, Firefox3.5+ で true
      return [-1, -1]; // [-1, -1] を返すと、altcss の機能(マークアップ, レンダリング)を両方 off にできる
    }
    return [0, 0]; // [0, 0] で altcss は自動的に適用される
  }
};
</script>
<script src="uupaa.0.7.js"></script>
<script>
function xboot(uu) {
  ....
}
</script>

デモ

http://pigs.sourceforge.jp/blog/20091203/altcssoff.htm

IE, Opera, Firefox3, Safari3.x で見た場合は altcss の機能を使って影を描画し、

Firefox3.5, Safari4, Google Chrome なら、ブラウザの機能を使って描画します。

修正前

// uu.css3.js

uu.ie     && (uu.ver.ua >= 6)                       && (++_mark, ++_plus);
uu.opera  && (uu.ver.ua >= 9.5)                     && ++_plus;
uu.gecko  && (uu.ver.re >  1.8 && uu.ver.re <= 1.9) && ++_mark;
uu.gecko  && (uu.ver.re >  1.8)                     && ++_plus;
uu.webkit && (uu.ver.re >= 522 && uu.ver.re <  530) && ++_mark;
uu.webkit && (uu.ver.re >= 522)                     && ++_plus;

switch (uu.config.css3markup) {
case -1: _mark = 0; break;
case  1: _mark = 1;
}

修正後

// uu.css3.js

// +------------+----------------+---------------+
// |            | mark = 1       | plus = 1      |
// +------------+----------------+---------------+
// | IE         | 6, 7, 8        | 6, 7, 8       |
// | Opera      |                | 9.5 +         |
// | Gecko      | 1.81 ~ 1.9     | 1.81 +        |
// | Webkit     | 522 ~ 529      | 522 +         |
// +------------+----------------+---------------+
(function() {
  uu.ie     && (uu.ver.ua >= 6)                       && (++_mark, ++_plus);
  uu.opera  && (uu.ver.ua >= 9.5)                     && ++_plus;
  uu.gecko  && (uu.ver.re >  1.8 && uu.ver.re <= 1.9) && ++_mark;
  uu.gecko  && (uu.ver.re >  1.8)                     && ++_plus;
  uu.webkit && (uu.ver.re >= 522 && uu.ver.re <  530) && ++_mark;
  uu.webkit && (uu.ver.re >= 522)                     && ++_plus;

  // http://d.hatena.ne.jp/uupaa/20091203/1259828564
  if (uu.isfunc(uu.config.altcss)) {
    // 0 is auto, 1 is enable, -1 is disable
    var ary = uu.config.altcss(uu); // @return Array: [mark, plus]

    _mark = { "-1": 0, 0: _mark, 1: 1 }[ary[0]];
    _plus = { "-1": 0, 0: _plus, 1: 1 }[ary[1]];
  }
})();


この変更は次回のリリースから適用されます。