Greasemonkeyではてなダイアリーのリンク元を整形


はてなダイアリーリンク元を整形するGreasemonkeyスクリプトを先日書いたので、始めてから形になるまでの流れをメモしておこうと思います。
(後略)

以前の記事におとなり日記で表示されたケーズメモさんが、はてなダイアリーの記事編集画面の下部に表示されるリンク元のリストを見やすいように整形するGreasemonkeyスクリプトを書いていらっしゃったので、インスパイヤされてPermalinkで表示されるリンク元のリストの方を整形するスクリプトに書きかえてみました*1。リンクの要素を取ってくる部分をPermalink用に変えて、URLマッチングの部分を増やしてみただけです。

// ==UserScript==
// @name           HatenaSimpleReferer
// @namespace      http://d.hatena.ne.jp/*
// @description    はてなのリファラをシンプルに表示
// @include        http://d.hatena.ne.jp/*
// ==/UserScript==


(function ()
{
    var div = document.getElementById('days');
    var uls = div.getElementsByTagName('ul');
    
    var n = 0;
    re = new RegExp("<div class=\"caption\">\u30ea\u30f3\u30af\u5143<\/div>");
    for(var i=0; i<uls.length; i++)
    {
        if(re.test(uls[i].parentNode.innerHTML))
        {
            n = i;
            break;
        }
    }
    
    var links = uls[n].getElementsByTagName('a');
    
    for(var i=0; i<links.length; i++)
    {
        var txt = links[i].innerHTML;
        txt = txt.replace(/^http:\/\//, '');
        
        // Google
        if(txt.match(/^(www|blogsearch).google.\w+(.\w+)?\/(\w+\/)?(search|custom|ie)\?(.+)/))
        {
            links[i].innerHTML = "Google(" + query_cutter(RegExp.$5, 'q=') + ")";
        }
        // Yahoo
        else if(txt.match(/^search.yahoo.\w+(.\w+)?\/(\w+\/)?(search|custom|ie)\?(.+)/))
        {
            links[i].innerHTML = "Yahoo(" + query_cutter(RegExp.$4, 'p=') + ")";
        }
        // Yahoo Blog-Search
        else if(txt.match(/^blog-search.yahoo.\w+(.\w+)?\/(\w+\/)?(search|custom|ie)\?(.+)/))
        {
            links[i].innerHTML = "YahooBlogSearch(" + query_cutter(RegExp.$4, 'p=') + ")";
        }
        // Hatena Diary
        else if(txt.match(/^d.hatena.ne.jp\/keyworddiary\/(.+)(\?.+)?/))
        {
            links[i].innerHTML = "KeyWordDiary(" + RegExp.$1 + ")";
        }
        else if(txt.match(/^d.hatena.ne.jp\/keywordmobile\/(.+)(\?.+)?/))
        {
            links[i].innerHTML = "KeyWordMobile(" + RegExp.$1 + ")";
        }
        else if(txt.match(/^d.hatena.ne.jp\/keyword\/(.+)(\?.+)?/))
        {
            links[i].innerHTML = "KeyWord(" + RegExp.$1 + ")";
        }
        else if(txt.match(/^d.hatena.ne.jp\/diarylist/))
        {
            if(txt.match(/rss/))
            {
                links[i].innerHTML = "DiaryList(rss)";
            }
            else
            {
                links[i].innerHTML = "DiaryList";
            }
        }
        else if(txt.match(/^d.hatena.ne.jp\/([\w\-]+)\/?/))
        {
            links[i].innerHTML = "User(" + RegExp.$1 + ")";
        }
        else if(txt.match(/^d.hatena.ne.jp\//))
        {
            links[i].innerHTML = "HatenaDiary";
        }
        // Hatena Antenna
        else if(txt.match(/^a.hatena.ne.jp\/([\w\-]+)\/?/))
        {
            links[i].innerHTML = "AntennaUser(" + RegExp.$1 + ")";
        }
        // LivedoorReader
        else if(txt.match(/^reader.livedoor/))
        {
            links[i].innerHTML = "LivedoorReader";
        }
        // Google Cache
        else if(txt.match(/72.14.235.104\/(\w+\/)?(search|custom|ie)\?(.+)/))
        {
            txt = query_cutter(RegExp.$3, 'q=');
            txt = txt.replace(/cache:\w+:[\w\/\.]+,\s/, '');
            links[i].innerHTML = "Googlecache(" + txt + ")";
        }
    }

    function query_cutter(query_full_txt, query_sign)
    {
        var splited_queries = query_full_txt.split(/&amp;/);
        var query = '';
        
        for(var i=0;i<splited_queries.length;i++)
        {
            query = splited_queries[i];
            
            if(query.match('^' + query_sign))
            {  
                query = query.replace(query_sign, '');
                query = query.replace(/\+/g, ' ');
                query = query.replace(/\s/g, ', ');
                return query;
            }
        }
        return null;
    }
}
)();

Googleの検索結果だと「Google(hoge, fuga)」って表示されます。関数みたいに。
「links[i].innerHTML = "〜";」の部分を書き換えればおkっす。キーワードのクエリ処理とか他の検索エンジンは適宜追加の方針で。
これですごく見やすくなった。


それにしても初めてjavascriptを触ったのだが、なんて難解な言語だ。でも極めたらおもしろそう。

*1:著作権等問題がございましたら早急に対処いたしますのでお手数ですがご連絡頂けると幸いです。