同一サーバ内での複数のTracをまたいでの検索するページのソース

JQueryは1.0系じゃないと動かないみたいです。

JavaScriptJQueryの練習で書いてみた。適当なロゴ画像とローディング画像を持ってきて、以下のコードを貼っつけるとこんな感じになります。

普通にリクエスト投げてHTMLのスクレイピングしてるけど、XML-RPCプラグイン入れてるんだから、それ使えばいいと書いてる途中で気付きました。けど、これはこれで面白かったのでそのまま。

JQuery1.0.3でIEだと動いてませんでした。たぶん原因はNew Ticket – jQuery Core - Bug Trackerだったぽい。ついでにshowとhideを使うようにして、ちょっとだけJQueryらしく書き換え。

$(function(){
    var base_url = "http://someTracSite/";

    var check_attribute = function(key) {
        return $( "#" + key ).attr("checked")? "&" + key + "=on": "";
    }
    $("span#loading").hide();
    $("span#loading").ajaxStart(function(){ $(this).show(); });
    $("span#loading").ajaxStop(function(){ $(this).hide(); });

    var projects = new Object();
    var retrieve_projects = function(data, status) {
        var temp_elem = $(document.createElement("div"));
        temp_elem.html(data);
        var a_elem = $("a",temp_elem);

        var select_elem = $("#projects");
        a_elem.each(function(){
            var href_attr = $(this).href().split("/")[4];
            projects[ href_attr ] = { pj_name:href_attr, pj_title:$(this).text(), pj_url:$(this).href() };
            var option_elem = $( document.createElement("option") );
            option_elem.html( $(this).text() );
            option_elem.val( href_attr );
            option_elem.addClass( "project" );
            select_elem.append( option_elem );
        });     
    }
    $.get(base_url, retrieve_projects );

    var search_into_project = function(project) {
        return function(data, status) {
            var temp_elem = $(document.createElement("div"));
            temp_elem.html(data);

            // prefixでTracってついてるwikiページを検索結果から除外
            $("dl#results dt", temp_elem).each(function() {
                if ($(this).text().match(new RegExp("^Trac")) != undefined) {
                    $(this).next().remove();
                    $(this).next().remove();
                    $(this).remove();
                }
            });

            var res_elem = $("div#searchable",temp_elem);
            $("a", res_elem).attr("target", "_blank");

            var res_area_elem = $(document.createElement("div"));
            res_area_elem.addClass("indiv_result"); 
            $("div#search_result").append( res_area_elem );

            var h3_elem = $(document.createElement("h3"));
            var a_elem = $(document.createElement("a"));
            a_elem.html(project.pj_title);
            a_elem.href(project.pj_url);
            h3_elem.append(a_elem);

            res_area_elem.append( h3_elem );
            if (res_elem.size() == 0) { 
                res_area_elem.append( "no matches..." );
            } else {
                res_area_elem.append( res_elem );
            }       
        }       
    }

    $("#whole_search").click(function(){
        $("div#search_result").empty();

        var elem_selected = false;
        var project_elems = $("option.project");
        $.each( project_elems, function ( i ) { 
                if (this.selected) {
                    elem_selected = true; 
                    var req_url = base_url + projects[ this.value ].pj_name + "/search?q=" + $( "#q" ).val() + check_attribute("wiki") + check_attribute( "changeset" ) + check_attribute( "ticket" );
                    $.get( req_url, search_into_project( projects[ this.value ] ) );
                }       
            }       
        );      

        if (!elem_selected) {
            $.each( projects, function( i ) {
                    var req_url = base_url + this.pj_name + "/search?q=" + $( "#q" ).val() + check_attribute("wiki") + check_attribute( "changeset" ) + check_attribute( "ticket" );
                    $.get( req_url, search_into_project(this) );
                }
            );
        }
    });
});
<!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Trac Whole Search</title>
<link rel="stylesheet" href="../trac/SOME_TRAC_SITE/chrome/common/css/trac.css" type="text/css" />
<link rel="stylesheet" href="../trac/SOME_TRAC_SITE/chrome/common/css/search.css" type="text/css" />
<style type="text/css">
span#loading {
  margin-left:50px;
  position:relative;
  top:10px;
}

div.indiv_result {
  background-color:#F7F7F7;
  margin-left:20px;
}
</style>
<script type="text/javascript" src="../trac/SOME_TRAC_SITE/chrome/common/js/trac.js"></script>
<script type="text/javascript" src="jquery-latest.pack.js"></script>
<script type="text/javascript" src="trac_ws.js"></script>
<script type="text/javascript">
</script>
</head>
<body>
<h1>
  <label for="q"><a href="http://tws_site/tws/"><img src="img/tws_logo.png" alt="Trac Whole Search" /></a></label>
</h1>
<div id="metanav" class="nav">
  <ul>
    <li class="first">&nbsp;</li>
    <li>&nbsp;</li>
  </ul>
</div>
</div>
<div id="mainnav" class="nav">
  <ul>
    <li class="first">&nbsp;</li>
    <li>&nbsp;</li>
    <li class="active">&nbsp;</li>
    <li class="last">&nbsp;</li>
  </ul>
</div>
<div id="main">
  <div id="content" class="search">      <p>        <input type="text" id="q" name="q" size="40" value="" />
        <input id="whole_search" type="submit" value="検索実行" />
        <span id="loading"><img src="img/indicator_medium.gif"/></span>
      </p>
      <p>
        <input type="checkbox" id="ticket" name="ticket" checked="checked" />
        <label for="ticket">Tickets</label>
        <input type="checkbox" id="changeset" name="changeset" checked="checked" />
        <label for="changeset">Changesets</label>
        <input type="checkbox" id="wiki" name="wiki" checked="checked" />
        <label for="wiki">Wiki</label>
        <select name="projects" id="projects" multiple="multiple"></select>
      </p>
    <hr />
    <h2>Search Result</h2>
    <div id="search_result"></div>
    <hr />
  </div>
</div>
<div id="footer">
  <hr />
  <p class="left">footer</p>
  <p class="right">
    <a href='http://jquery.com/' title='jQuery JavaScript Library'><img src='http://jquery.com/files/buttons/110x31_gr01.png' alt='jQuery JavaScript Library' title='jQuery JavaScript Library' style='border:none;'/></a>
  </p>
</div>

</body>
</html>