べつになんでもないこと

PDF/PPT Viewer with Google Docsをqueryselector版に修正した - otsune's SnakeOilを見てからいつか書き直そうと思っていたのですが、Document.querySelectorはFirefox 3.0.xで使えないこともあって放置してました。

今回、某掲示板のPDF（ime.nu経由）は置き換えちゃいけないなぁ（やずやのアレで気がついた）ということで、見直しついでにqueryselector版に書き直すことにしました（Fx 3.0.xのサポートも終了ですし）。

// ==UserScript==
// @name           PDF/PPT/TIF viewer with Google docs
// @namespace      http://puppet.asablo.jp/blog/2010/05/01/5055573
// @include        http://*
// @include        https://*
// @exclude        http://docs.google.com/*
// ==/UserScript==
// Based on script by Koonies (http://d.hatena.ne.jp/Koonies/): http://userscripts.org/scripts/show/59557
// Based on script by otsune (http://subtech.g.hatena.ne.jp/otsune/20100124/pdfpptviewerwithgoogle)

(function() {
    var l = document.querySelectorAll('a[href$=".pdf"], a[href$=".ppt"], a[href$=".tif"]');
    for (var i = 0; i < l.length; i++) {
        if  ((l[i].hostname != "docs.google.com")
          && (l[i].hostname != "b.hatena.ne.jp")
          && (l[i].className != 'ujspdflk')) {
            var logo = document.createElement("img");
            logo.src = 'data:image/gif;base64,R0lGODlhEAAQAPMAAACh6P///3BvbtpEQt+Wld5+fNQqJ+PIxu/X1tqwrq49O9doZsfHx6RST4eHh/Dp6SH5BAEAAAAALAAAAAAQABAAAARbEMhJqxQ4a0xF+GDICJMXnsx4nQFSICAJmCFREPF6HgP+ybTQ4JCbsQIGAzEAZCUIhOFDgDCeConAIKkoWEOLxWBBSCgI309hgC3SeANYCJgxKBqOjYwSrVoAEQA7';
            logo.border = 0;
            logo.style.margin = '0';
            logo.style.padding = '0';
            var orgpdf = document.createElement("a");
            orgpdf.href = l[i].href;
            orgpdf.className = 'ujspdflk';
            orgpdf.insertBefore(logo, orgpdf.firstChild);
            l[i].href = 'http://docs.google.com/viewer?url=' + l[i].href;
            l[i].target = '_blank';
            l[i].parentNode.insertBefore(orgpdf, l[i].nextSibling);
        }
    }
})();

10.05.03 リンク先のホストが「b.hatena.ne.jp」の場合置き換えないように変更
10.09.26 AutoPagerize対応はこちら

PDFアイコンは
logo.src = 'http://wwwimages.adobe.com/www.adobe.com/ubi/template/identity/adobe/screen/icon/pdf.gif';
の方が文字数的に楽かも。
あるいはリンクをアイコンごとコピペしないなら、OSで関連付けされているアイコン
logo.src ='moz-icon://.pdf?size=16';
にするともっと楽かも。

パクり参考元との違いは

• 挿入するアイコンはオリジナルのリンクになっていますので誤爆してもアイコンをクリックすれば回避できます。
• AutoPagerizeに対応してません（使ってないのでテストできないから削りました）。
• Greasemonkeyで動くか分かりません（userContent.jsを使ってるので）。
• if (location.hostname == "docs.google.com") return;を省いています。
  ファイル名を「PdfPptTifWithGDV!{docs.google.com}!{^.2ch.net}.user.js」にして、docs.google.comと2ch.netで動かないよう指定してるのでなくてもいいだろうと。
  必要なら、(function() {の次の行に挿入して下さい。
• はてなブックマークとうちのブログの余計なお世話に対応ｗ詳細は前回の話を参照。

AutoPagerizeへの対応は、変数書き換えてif文以下を参考元と差し替えればいいはずだから説明はいらないと思います。

ime.nuをはてなブックマークと同じように弾くか、2ch.netでスクリプトを起動させないかで少し迷いましたが、2chにPDFが置かれることもないだろうということで、スクリプトを起動させない（上のファイル名の話）ことで回避することにしました。
通常、他のドメインを開くときにワンクッション置くサイトでは、はてなブックマークのようにして置き換えをキャンセルします。

ごちゃごちゃ書きましたが、どうせ私しか使ってないのだし、次回修正のときのための覚書です（爆）。

ところでquerySelectorを使ったメリットですが、4/29日のセキュリティホール memoでちょっと計ってみました。
旧版：68ms
新版：24ms
リンクがたくさんあるページだとかなり有利なようです。配列も少なくて済むので、速度以外の負担も小さくなっていいと思います。

そうそうお約束ですが、このスクリプトを使う際は、自己責任でお願いします。ブログに書いて公開してはいますが、基本、自分のための覚書ですので、使って下さいという意味ではないということでご理解ください。

なにしろ今回でさえindexOfってそういう意味だったのかぁ（いままで気にしてなかった）とか、functionってそうやってつかうんだ……とつぶやきながらソースをいじる無茶な人ですので、とんでもない落とし穴を掘ってるかもしれません。

リファレンスも見たことないのに、ググればなんとなくスクリプトをカスタマイズできるなんて、良い時代になったものだ（爆）。

最後に、これ書く前に読んでいれば、試行錯誤はなかったのに……残念。
関数と変数のスコープ - マンガで分かる JavaScriptプログラミング講座
型、オブジェクト、クラス - マンガで分かる JavaScriptプログラミング講座

でも、連載前（4/25日）には出来上がってたから、しかたないね。