プログラミング

テーブルソーター

おはようございます、Crafordです。

beyondには組み込んでいますが、自作したテーブルソーターが意外と便利なので、コード公開しておきます。
利用・改変は自由ですが、自己責任でお願いします。

isNumeric() メソッドを利用していますので、jQuery1.7以上が必要です。

/**
* 任意のjQueryセレクタ指定のtrタグを基準としたテーブルソーター
* 各ソートリクエストのクリックイベントごとにこのメソッドを呼び出す必要があります。
*
* @param <string> selector trタグを特定するためのjQueryセレクタの文字列(ex. "#id table tbody tr"
* @param <int> offset selectorで特定したtrタグの幾つめからソート対象のデータとするか(2つめのtrなら2)
* @param <int> index trタグ内のいくつ目のtdタグをソート対象列とするか(一番左が0)
* @param <boolean> order_ascend 昇順ソートならtrue, 降順ソートならfalse
* @param <function> call_back ソートルールを任意に指定する場合はコールバック関数を指定。検出したtdタグ内の評価をする処理が必要です。
*/
function tableSorter(selector, offset, index, order_ascend, call_back) {
    // ソート対象の列を記憶し、テーブルから削除
    var list = $(selector);
    var nodes = [];
    for (var i = offset; i < list.length; i++) {
        var obj = new Object;
        if (typeof call_back != 'undefined') {
            obj.value = call_back(list.eq(i).children("td").eq(index));
        } else {
            obj.value = list.eq(i).children("td").eq(index).text().replace(/ /g, "");
        }
        obj.html = list.eq(i).prop('outerHTML');
        nodes.push(obj);
        list.eq(i).remove();
    }

    // ソート対象列を並び替える
    nodes.sort(
        function(a, b) {
            var result = 0;
            if ($.isNumeric(a.value) && $.isNumeric(b.value)) {
                var num1 = parseInt(a.value);
                var num2 = parseInt(b.value);
                if (num1 < num2) {
                    result = -1;
                } else if (num1 > num2) {
                    result = 1;
                }
            } else {
                result = a.value.localeCompare(b.value);
            }
            if (order_ascend) {
                return result;
            } else {
                return -result;
            }
        }
    );

    // テーブルに再描画
    for (var i = 0; i < nodes.length; i++) {
        $(selector).parent().append(nodes[i].html);
    }
}

callbackの記述例。

var func = function(a) {
    // tdタグ内のaタグに書かれたid=の値を元に数値ソートする
    var match = a.children('a').attr('href').match(/id=([0-9]*)/);
    return match[1];
}

[ブラウザ三国志]mixi鯖用ツール開発者向け情報

mixi鯖の1期、2期、3期以降の判定ロジックを作りました。

var sv_season;

var svchk1 = document.evaluate('//*[@class="snavi_friends fade"]',

                               document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
if( svchk1.snapshotLength > 0 ){
    // "ともだち紹介" が存在すれば1期
    sv_season = 1;
}
else{
    var svchk2 = document.evaluate('//h1[@class="siteID"]/img',
                                   document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
     if( svchk2.snapshotItem(0).getAttribute("src").indexOf("http://") >= 0 ){
        // "ブラウザ三国志"ロゴのURLがフルパスなら2期
        sv_season = 2;
    }
    else{
        // それ以外なら3期以降
        sv_season = 3;
    }
}

鯖判定が必要なツールを作る場合に使ってみてください。