jQuery には $ の競合を避けるための jQuery.noConflict という function が用意されていますが、これに引数で true を渡すと、window.jQuery オブジェクトの競合も避けるように動作します。

ですので以下のように書けば、複数のバージョンの jQuery が共存出来ます。
現実的にやる事はないと思いますが、onload を追加する事で、3つでも 4 つでも共存可能という事です。

<script>
$(function() {
    var func = function() {
        // 実際に動作させたい部分
        var $16 = jQuery.noConflict(true);
        alert($.fn.jquery);  // old version
        alert($16.fn.jquery);  // ver 1.6
    }
    // 使いたいバージョンの jQuery を用意し、load イベントを設定
    var s = $('<script>').attr('src', 'http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js').load(func).get(0);
    // IE の場合は script の onload が発生しないので onreadystatechange で検知
    s.onreadystatechange = function() {
        if (this.readyState == 'loaded' || this.readyState == 'complete') {
            func();
        }
    }
    // jQuery.append だと load イベントが発生しない(？)ようなので、生 DOM で head に script を追加
    $('head').get(0).appendChild(s);
});
</script>

Ver.2 を名乗る割に、機能的には Ver.1 を踏襲しただけというのが残念ではありますが、適宜先読みを行ったり、取得したデータをキャッシュする事で、従来版よりキビキビと動くようになっています。
その分、メモリの消費は増えているのですが、昨今のトレンドに沿った修正ですし問題ないと思っています。

デザインに関しては、HTML5 / CSS3 の構成で作っています。最近、個人でサイトを作る時は全力で IE を無視するので、HTML5 / CSS3 の機能を存分に使えて気持ちいいです。

今回、webkit に限ってですが、transition を初めて使ってみました。これ、これまで食わず嫌いで使ってなかったのを後悔しましたよ。「あっても無くても機能には支障ないけど、あるとちょっと嬉しいワンポイントアニメ」とかが、楽に表現出来ます。
散々言われていた事ですが、自分で使ってみて初めて本当に理解するっていう感じです。

それと、CSS3 を使い込んで頑張ってみたのがツールバー＆タブのデザイン。

これを画像無しに表現出来るようになるとは驚きです。
ツールバー部分だけを抜き出してみれば、マークアップもシンプルです。

<h3 class="tab selected">フォローしている</h3>
<h3 class="tab ">フォローされている</h3>
<div class="toolbar"></div>

最近の Web デザイン系の記事に触発されて 1px のラインを入れてみたりしてます。
この CSS だけ取り出しても面白いかと思うので、そこはまた別の記事におこします。

最後に、ソーシャル系のボタンとして、はてブ・Twitter・Facebook を付けてみました。
それぞれ公式のスクリプトを生成して貼り付けた感じですが、はてブと Facebook は URL とかページタイトルの指定が固定で入るような形だったので、そこは動的に取るようにしています。

その点、Twitter のボタンはどんなページでも共通のスクリプトを貼り付けるだけでよいので楽ですね。一方、「このサイトのボタンは、どんなページにあってもサイトのトップに対するボタンにしたい」ってのが Twitter だとできないです。
まあ、プロモーション上、サイトのトップにソーシャルのアクセスを集中させたい気持ちは分からないではないんですが、ユーザは「今見てるページ」をブクマしたかったり「いいね！」したかったりすると思うので、そういうのは避けたいです。

さて、せっかく TwitMgr 自体を綺麗に書き直したので、今後は少し機能拡張もやろうと思ってます。
初代 TwitMgr リリース時点では機能が存在していなかったリストへの対応とスパム報告への対応が当面の目標です。
この 2 つは、いま自分で TwitMgr を使うにあたって欲しいと思ってる機能なので、確実に実現させると思います。
その他にも何かフィードバックがあれば、是非教えて下さい。

また同時に、TwitAPI.js 用プロキシサーバである taj-proxy も、build 5 を公開しています。
これは、TwitAPI.js 本体の更新とは関係なくて、従来、Twitter API にアクセスする URL として固定で https://twitter.com/… となっていたのを、現在の正しいドメインである、https://api.twitter.com/… に変更したという対応です。
これをしないと最新の API が利用出来ずに困った事になっていました。

しばらく放置していたのですが、最近ちょっと時間が出来て TwitMgr のリライトを再開出来たので、それに合わせたアップデートになります。

というわけで次は TwitMgr の新バージョンを報告出来るといいのですが、それはまだ先の話。

任意のサイトを対象とした user.js を書くにあたって、自分のテストを楽にするために書きました。

GM Test

javascript:(function(d){var%20a=prompt('Enter%20script%20URL.');if(a){var%20s=d.createElement('script');s.src=a;d.getElementsByTagName('head')[0].appendChild(s);}})(document);

旧版までは、アニメーションとか使ってそれらしく見せていたんですが、今バージョンからは単に position:fixed で固定しています。Google のデザインがどんどんシンプルになっていくので、それに合わせたというか、ぶっちゃけていうと DOM が大きく変わったのでそれに追随するのが面倒だったというか。

なので実装としては、動的に CSS を追加しているだけなので、そんなんユーザスタイルシートとかでやれよ、ってのはごもっともな指摘ですが、まあ誰でもワンクリックで適用出来るっていうメリットが大きいのでいいのです。

ところで、ずっと Chrome で動作確認していて、使いながらバグを取ってそろそろいいかな、と思ったので公開に踏み切ったわけですが、最後に Firefox で確認してみるとこれが予想以上にぼろぼろでした。
position: fixed の挙動に関して、そんなに違いがあるんでしょうかね？

SERPs の DOM の入れ子の状態が、見た目から予測される入れ子と大きく違っていたせいで、色々と position をいじり倒しているせいかもしれません。
なので、Firefox の方はごめんなさい。上手く動いてません。

リリース直後から、様々な非難を受けていた現仕様のはてブエントリーページですが、あれほどの反応にもかかわらず、リリースから 2 ヶ月経っても、旧仕様を選べるようにするなどの対応は取られていないようです。

個人的な感想で言うと、旧仕様の時もスターの数を頼りに流し読みする事もあったし、完全否定という立場ではないのですが、はてブの伸びを表すグラフとか良く見てたので、それが見れないのと、やはり多くの指摘にあるように、時系列でブコメを追いたい時にいちいち違うページを開くのが面倒という思いがありました。

そして 2 ヶ月。1 クリックごとのフラストレーションが、徐々に溜まり続けました。

2 ヶ月経ってもはてなからは特に動きが無いので、これはもう「こっち (運営) でやる気はないから、どうにかしたいならそっち (ユーザ) で何とかしな！」というはてなからの挑戦だと受け取り、上記のスクリプトを書きました。

単に、「すべてのブックマークを見る」にリダイレクトするのではなく、現状のエントリーページの中に、全てのブックマークをスムーズに統合して、出来る限り (記憶にある限り) 旧仕様に近づけているのが特徴です。
「人気のブックマークコメント」情報はあっても良いかと思ったので、項目自体は残しつつ、不要な時は閉じられるように配慮しています。

当初、もう少し簡単に出来るかなと思っていた部分が、案外難しく、はてブ側のスクリプトの中にまで手を入れて実現している機能とかがあります。
はてなで作って使っている JavaScript のライブラリに妙に詳しくなったりしつつ、試行錯誤を繰り返し、ようやく公開出来るレベルにまでなりました。

現仕様のエントリーページに苦々しい思いを持っている方は、是非おためし下さい。

はてなの方へ

上で色々と生意気な事を書きましたが、公式に対応して旧仕様を選べるようにしてもらえるのがベストに決まっています。
公式に対応されればこちらでもアナウンスして、公式機能の利用を促すようにするので、サーバに負荷をかける部分もあって恐縮ですが、公式対応までの間はお目こぼし頂けるととても嬉しいです。

参考にしたページなど

2011-04-05 – はてなブックマーク日記 – 機能変更、お知らせなど
はてなブックマークのエントリーページ改良が何を狙っているのか – 没個性テーマパーク
はてブのエントリーページ“改良”に疑問の声 – さまざまなめりっと
はてなブックマークのUIが大幅リニューアル(個人的に改悪)な件 – y-kawazの日記
新しいはてブが不評と聞いたので、全てのブックマークを見るグリモンスクリプトを作ったよ！（使えるかもしれないものが出来たので追記あり） – 不動産屋のラノベ読み

そこで、Chrome 対応版のスニペットを用意しました。
ただ、いわば Chrome のセキュリティを回避した書き方になるため、旧版にあった、「該当ページですでに jQuery が読み込まれていればそれを利用」という特徴が失われてしまっています。
逆に言えば、常に自分で指定したバージョンを利用できるので、jQuery の新しい機能を使ったスクリプトを書く場合などは、こちらのほうが優れています。

スクリプト

(function (d, func) {
    var h = d.getElementsByTagName('head')[0];
    var s1 = d.createElement("script");
    s1.setAttribute("src", "http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js");
    s1.addEventListener('load', function() {
        var s2 = d.createElement("script");
        s2.textContent = "jQuery.noConflict();(" + func.toString() + ")(jQuery);";
        h.appendChild(s2);
    }, false);
    h.appendChild(s1);
})(document, function($) {
    // ここにメインの処理を書く
    $('#button').click(function(){
        alert('clicked!');
    });
});

こんな感じに動きます。

詳細は以下の専用ページよりどうぞー。
jquery.smoothswap.js

色を指定した都道府県がその色で塗られた地図を、Google Chart API で作り出します。
ざっくりなので適当ですが楽しんで頂ければ。

ちなみにカラーピッカーは、右下の虹色の丸いアイコンで確定です。ちょっと分かりにくいですよねー。

それにしても Google Chart API すげーなー。

英語で数字を表現する時、当然の事ながら「万」「億」「兆」という単位は使わず、「ミリオン」「ビリオン」などの単位を使いますが、日本語では 4 桁で数字を区切って表現するのに対し、英語では 3 桁で区切って表現します。
会計などで金額を扱う際、カンマを打つ時も 3 桁ごとです。
メモリや HDD の容量でおなじみの SI 単位系も、「キロ」「メガ」「ギガ」と、10³ 区切りです。

これが慣れない。どうしても直感的に変換できない。というかそもそも「直感的」な話ではないですね。
必要になる度に、毎回数字にばらして、桁を数えて…などとしてました。
ですが、いい加減面倒になったので、数値単位変換 っていうツールを作りました。

「1ミリオン→100万」も、「1兆→1トリリオン」も思いのままに変換できます。
同じ悩みのある諸氏は是非ご活用下さい！

技術的な話

とりあえず大きな数を扱うから BigInt だな、という話なんですが、BigInt 同士の演算とか特に不要でしたし、ツールのキモになるのはむしろ「1兆」＝「1,000,000,000,000」というパーサ部分だったので、既存の BigInt ライブラリは特に使わず、独自に実装する事にしました。
効率よりもわかりやすさ重視で、パースしやすいデータ構造を持たせた感じです。

で、肝心のパーサなんですがこれがなかなか大変でした。

「千」だけでも「1,000」ですが、「一千」と書いても「1,000」ですね。
「千百十万」も「1110万」も同じ「11,100,000」です。
さらに、英語の「eleven」はその 1 単語で 2 桁分の「11」を表したりします。

そんなこんなの難問を解決した結果、「1ミリオン」でも「100G」でも「10000000000000000」でも「999億9万9000」でも「壱億弐仟参佰泗拾伍萬陸仟漆佰捌拾玖」でも「fifteen millions and four thousands three hundreds twenty one」でも、正しくパースできるようになりました。

もはや当初の目的を超えて作り込んでしまった感じですが、面白かったので良しとしましょう。