半角カタカナを読みやすくするブックマークレット

2chで現在連載中の某やる夫ストーリーがおもしろい。

やる夫ブログ（裏）http://yaruoura.blog86.fc2.com/ さんにまとめてあるので、それを読んでいるのだけど、半角カタカナを多用していて少し読みにくい。

そこで、半角カタカナを読みやすくするブックマークレットを作ったぜ。

このブックマークレットを実行した後、半角カタカナの上にマウスカーソルをかざすと、全角ひらがなが表示されるという機能がある。

特徴

IE6では動かない。Firefox3.0とGoogleChrome1.0だけで動作確認した。
~~重い。Firefoxだと1分くらい待たされる上に「応答なし」という警告が出る。Chromeだと15秒くらいで警告もなく動作完了するのでChromeおすすめ。~~ (2009/2/06 スクリプトを高速化するよう組みなおした。Firefoxでも5秒程度で終了するようになった)
新しくページを読み込むたびにブックマークレットを毎回実行する必要がある。

どこのサイトでも動作するはず。「やる夫ブログ（裏）http://yaruoura.blog86.fc2.com/」だけでなく、「無題のドキュメント http://mudainodqnment.blog35.fc2.com/」の同じ記事でも動作した。パー速の元スレ vip2ch.com/part4vip でも動作した。

インストール方法

適当なwebページ(たとえばこのページ)をブックマークする。
ブックマークしたのを右クリックして、「プロパティ」(Firefox)または「編集」(Chrome)を選ぶ。
ブックマークの「URL」に以下の文字列を入れる。改行は省いて、1行にして入力してくれ。
ブックマークの「名前」は「半カナ」とでもしておく。
[変更を保存](Firefox)または[OK](Chrome)を押してブックマーク編集を終了する。

使い方

どこか半角カタカナのあるページを表示しているときに、さっきのブックマークをクリックする。
「半カナマウスオーバー処理しますか？」と聞かれるのでOKをクリック。「半カナ処理完了」と表示されるまで待つ。
半角カタカナの上にマウスカーソルをかざす。

「URL」に入れる文字列

(2009/03/26 このページの下のほうに修正版があります。そちらを使用してください)

javascript:(function(){if(confirm('半カナマウスオーバー処理しますか？')==false){return;}var h='ﾞｱｲｳｴｵｶｷｸｹｺｻｼｽｾｿﾀﾁﾂﾃﾄﾅﾆﾇﾈﾉﾊﾋﾌﾍﾎﾏﾐﾑﾒﾓﾔﾕﾖﾗﾘﾙﾚﾛﾜｦﾝｧｨｩｪｫｬｭｮｯﾟｰ､｡･｢｣?!';var z='゛あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゆよらりるれろわをんぁぃぅぇぉゃゅょっ゜ー、。・「」？！';var ho=document.body.innerHTML;var hn='';var hc=false;var bo='';var bn='';for(var i=0;i<ho.length;i++){if(/[\uff61-\uff9f]/.test(ho.charAt(i))){var k=0;for(k=0;k<h.length;k++){if(ho.charAt(i)==h[k]){break;}}hc=true;bo+=h[k];bn+=z[k];}else{if(hc==true){hc=false;hn+="<span title=\""+bn+"\">"+bo+"</span>";bo=''; bn='';}hn+=ho.charAt(i);}}if(bo!=''){hn+="<span title=\""+bn+"\">"+bo+"</span>";}document.body.innerHTML=hn;alert("半カナ処理完了");})()

マウスでコピペするときは、ブラウザでコピーしたものは不必要な部分が含まれがちだ。

いったんテキストエディタ(メモ帳など)にペーストして、必要な部分のみ（改行を含まない1行）をあらためて選択しなおしてからコピペするといい。

ちなみにスクリプトを1行にしない見やすいものも掲載しておく（こちらはブックマークレットには入れなくてよい）。このスクリプトは http://q.hatena.ne.jp/1135047216 を参考にした。

function(){
    if(confirm('半カナマウスオーバー処理しますか？')==false){return;}
    var h='ﾞｱｲｳｴｵｶｷｸｹｺｻｼｽｾｿﾀﾁﾂﾃﾄﾅﾆﾇﾈﾉﾊﾋﾌﾍﾎﾏﾐﾑﾒﾓﾔﾕﾖﾗﾘﾙﾚﾛﾜｦﾝｧｨｩｪｫｬｭｮｯﾟｰ､｡･｢｣?!';
    var z='゛あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゆよらりるれろわをんぁぃぅぇぉゃゅょっ゜ー、。・「」？！';
    //HTML取得
    var html_old=document.body.innerHTML;
    var html_new='';

    var hankana_continue=false;
    var buf_old='';
    var buf_new='';

    //頭から1文字ずつ見ていく。i:HTMLのあたまから何文字目か
    for(var i=0;i<html_old.length;i++){

        if(/[\uff61-\uff9f]/.test(html_old.charAt(i))){
            //半角カタカナだったとき
            var k=0;
            for(k=0;k<h.length;k++){
                if(html_old.charAt(i)==h[k]){
                    break;
                }
            }
            //html_newに出力せずに溜め込む
            hankana_continue=true;
            buf_old+=h[k];
            buf_new+=z[k];

        }else{
            //半角カタカナではない
            if(hankana_continue==true){
                //溜め込んだbufferを吐き出す
                hankana_continue=false;
                html_new+="<span title=\""+buf_new+"\">"+buf_old+"</span>";
                buf_old=''; buf_new='';
            }
            //html_newに単に1文字コピー
            html_new+=html_old.charAt(i);
        }//if(/[\uff61-\uff9f]/.test)

    }//for(i)
    //溜め込んだbufferが残ってたら出力
    if(buf_old!=''){
        html_new+="<span title=\""+buf_new+"\">"+buf_old+"</span>";
    }
    document.body.innerHTML=html_new;
    alert("半カナ処理完了");
}//function

参考リンク

Unicodeコンソーシアム CodeChartsの「Japanese-specific→Halfwidth Katakana」 http://www.unicode.org/charts/
JavaScript - MDC https://developer.mozilla.org/ja/JavaScript

追記 2009/3/26

作者さんが半角カタカナに半角スペースを入れるようになったようだ。上記のスクリプトは半角スペースがあると途切れるので、使いにくくなった。

そこで、半角スペースがあっても途切れないようにスクリプト修正した。

マウスカーソルを半角カタカナにあわせると、1行単位で、全角ひらがなに変換したツールチップ状に表示する。
ちなみに、なぜ画面表示されている半角カタカナそのものを全角ひらがなに置き換えしないのかというと、そうするとアスキーアートがくずれておかしくなるためだ。それを避けるため、画面表示そのものは変更せずに、ツールチップ表示としている。

今後は以下のスクリプトを使ってください。

「URL」に入れる文字列

javascript:(function(){if(confirm('半カナ マウスオーバー処理しますか？')==false){return;}var h='ﾞｱｲｳｴｵｶｷｸｹｺｻｼｽｾｿﾀﾁﾂﾃﾄﾅﾆﾇﾈﾉﾊﾋﾌﾍﾎﾏﾐﾑﾒﾓﾔﾕﾖﾗﾘﾙﾚﾛﾜｦﾝｧｨｩｪｫｬｭｮｯﾟｰ､｡･｢｣';var z='゛あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゆよらりるれろわをんぁぃぅぇぉゃゅょっ゜ー、。・「」';var t=' 　!?！？、。…,.，．';var ho=document.body.innerHTML;var hn='';var bo='';var bn='';for(var i=0;i<ho.length;i++){c=ho.charAt(i);if(/[\uff61-\uff9f]/.test(c)){var k=0;for(k=0;k<h.length;k++){if(c==h[k]){break;}}bo+=h[k];bn+=z[k];}else{if(bo!=''){var tf=false;for(j=0;j<t.length;j++){if(c==t[j]){tf=true;}}if(tf||c=='\n'||c=='\r'){bo+=c;bn+=c;}else{hn+="<span title=\""+bn+"\">"+bo+"</span>";bo=''; bn='';hn+=c;}}else{hn+=c;}}}if(bo!=''){hn+="<span title=\""+bn+"\">"+bo+"</span>";}document.body.innerHTML=hn;alert("半カナ処理完了");})()

見やすい版

function hankanafunc(){
    if(confirm('半カナ マウスオーバー処理しますか？')==false){return;}
    var h='ﾞｱｲｳｴｵｶｷｸｹｺｻｼｽｾｿﾀﾁﾂﾃﾄﾅﾆﾇﾈﾉﾊﾋﾌﾍﾎﾏﾐﾑﾒﾓﾔﾕﾖﾗﾘﾙﾚﾛﾜｦﾝｧｨｩｪｫｬｭｮｯﾟｰ､｡･｢｣';
    var z='゛あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゆよらりるれろわをんぁぃぅぇぉゃゅょっ゜ー、。・「」';
    var thru=' 　!?！？、。…,.，．';
    //HTML取得
    var html_old=document.body.innerHTML;
    var html_new='';

    var buf_old='';
    var buf_new='';

    //頭から1文字ずつ見ていく。i:HTMLのあたまから何文字目か
    for(var i=0;i<html_old.length;i++){
        c=html_old.charAt(i);

        if(/[\uff61-\uff9f]/.test(c)){
            //半角カタカナだったとき

            // 半角→全角変換
            var k=0;
            for(k=0;k<h.length;k++){
                if(c==h[k]){
                    break;
                }
            }

            //html_newに出力せずに溜め込む
            buf_old+=h[k];
            buf_new+=z[k];

        }else{
            //半角カタカナではない

            if(buf_old!=''){
                //半角カタカナの続きならば

                //特定文字ならば、html_newに出力せずに溜め込む
                var thruflag=false;
                for(j=0;j<thru.length;j++){
                    if(c==thru[j]){
                        thruflag=true;
                    }
                }
                if(thruflag || c=='\n' || c=='\r'){
                    buf_old+=c;
                    buf_new+=c;
                }else{
                    //溜め込んだbufferを吐き出す
                    html_new+="<span title=\""+buf_new+"\">"+buf_old+"</span>";
                    buf_old=''; buf_new='';
                    html_new+=c;
                }
            }else{
                //html_newに単に1文字コピー
                html_new+=c;
            }
        }//if(/[\uff61-\uff9f]/.test)

    }//for(i)
    //溜め込んだbufferが残ってたら出力
    if(buf_old!=''){
        html_new+="<span title=\""+buf_new+"\">"+buf_old+"</span>";
    }
    document.body.innerHTML=html_new;
    alert("半カナ処理完了");
}//function