PDFをGoogle Docsで開くグリモンをAutoPagerize対応に

PDFファイルをAdobe Readerで開かずに、Googleドキュメントのviewerで開く
Kooniesさんのあの素晴らしいスクリプトを、AutoPagerizeに対応させてみました。
ついでにhttpsにも対応。
オリジナル:快適!PDFのリンクをGoogle docs Viewer経由に置き換えるgreasemonkey - Koonies/こりゃいいな!

追記

otsuneさんの改良版。はてブを使っている人は特にこっちを推奨。
インストールも簡単です。
PDF/PPT Viewer with Google Docsをqueryselector版に修正した - otsune's SnakeOil - subtech


一応以下を残しておきます。

// ==UserScript==
// @name           PDF/PPT/TIF viewer with Google docs
// @namespace      http://d.hatena.ne.jp/Koonies/
// @include        http://*
// @include        https://*
// @exclude        http://docs.google.com/*
// @version        1.3
// ==/UserScript==

(function() {
    if (location.href.indexOf("http://docs.google.com/") != -1) return;
    function handle(node){
        var items = document.evaluate('.//a',node,null,7,null);
        for (var i = 0; i < items.snapshotLength; i++)
        {
             var item = items.snapshotItem(i);
			if (item.href.match(/^https*:([^?]+|[^:]+)\.(pdf|ppt|tif|tiff)$/i)) {
				var ico = document.createElement("img");
				ico.src = "http://docs.google.com/favicon.ico";
				item.parentNode.insertBefore(ico, item);
				item.href = 'http://docs.google.com/viewer?url=' + item.href;
			}
        }
    }
    document.body.addEventListener('AutoPagerize_DOMNodeInserted',function(evt){
        var node = evt.target;
            handle(node);
    }, false);
    handle(document);
})();

userscripts.orgにあげるものでもないので、更新したい方はコピペでお願いしますね。


PDFが2ページ目以降に出てきてもこれでOKです。

onclickで動作する改作バージョンもあるようですが、そちらはVimperatorで動作しなかったため避けました。

VimpとVimを使ってみて

不満1

そもそもhjklが左下上右
←↓↑→
というのがあまり納得いかない。こうがよかった。
←↑↓→
左は下よりも上に親和性が高いと思う。

c b a
f e d
i h g

より

a b c
d e f
g h i

の方が自然に見える。自販機の並びだってそうだし。


実際上の問題はツリー型タブを使っているので、「次のタブ=下のタブ」「前のタブ=上のタブ」となること。
するとhjklがこの順に<上のタブ><下へ半ページ><上へ半ページ><下のタブ>
となって、もうわけが...
もちろんjとkのキーを入れ替えてもよかったが、このhjklはいろんなところで共通のスタンダード配置のようだから、逆らわないことにしました。


といってももう今となっては慣れましたけどね。慣れって怖い。

ほらDDRだって...

違ったorz

不満2

Vimperatorと合わせてgVimも使いはじめました。
それで、HomeとEndが押しにくいのは欠陥だろうか。
(Homeは^または0キー(挙動は少し違う)、Endは$キー)
0はまだわかるにしても、$って...日本語キーボードならShift+4だと思うけれど、どうしてこんな重要なキーをShiftつきの押しにくいのにしてくれたのか。
(正規表現のマークをモチーフにしていることは覚えるにはいいけれど、文字の意味にこだわりすぎた悪い例だと思う。hjklを見習って欲しい。)
こいつらのせいで、IとかAとか希少な押しやすいキーをHome+iやEnd+aとかいう意味に割り当てなければならなくなっていて、もったいなさすぎる。
この時点で嫌になりもう一つの可能性Emacsについて調べたところ、こっちは上下左右から「有意味キーバインド」になっていた。
これならオレオレAHKキーバインドの方が文字入力は速かったかもしれない。
とりあえず今はをHOME,をEndにして使っている。本当はモディファイアつけたくないけれど...

とはいえ

やっぱりyyとかは便利だし、モードも慣れれば無変換押しながらhjklの動きに遜色ないくらい動きやすくなってきた。
他にもいろいろテクがあってマスターすればもっと便利になるんだろうなぁ。

Vim使ったことの無い人がVimperatorを使う

あけましておめでとうございます。
新年ということでついにこの世界に足を踏み入れてしまいました。
Vimperator。


以下、書いてみるとなんてことは無い内容なのですが
最初相当苦労したので(設定保存とかプラグインどうするのとか)初心を忘れないうちに書き留めておきます。


なお以下はWindows環境での話になります。
この界隈ではWindowsの情報の方が少ないかと思いますので、誰かの役にたてば幸いです。

インストールの前に

インストール後はメニューバー、各種ツールバーが消えるので覚悟が必要。
そこで、以下の2つを予習しておきます。
:set go=mTBr
これでツールバー類が復活します。
(goはguioption、mはmenu,Tはtoolbar,BはBookmark,rはright scrollbarの略のようです)
:addo
(または:addonsとフルに打ち込んでも構いません)
これでアドオン画面が呼び出せます。
この2つさえ覚えるか参照できるようにしておけば、あわててVimperator無効化したくなっても大丈夫です。
うまく打ち込めないときは、ESC(エスケープ)キーを何度か押してから、上の文字列を打ち込んでみましょう
(先頭のコロンから打ち込みます。コロンはコマンドを表すと考えておけばOKです)。

ではインストール

Vimperator :: Add-ons for Firefox
あとは普通に再起動。

最初にやること

まずはツールバー類を表示する方がいいでしょう。(現在はgo=rにしています)
:set go=mTBr
と打ち込むか、上記をコピペします。
ちなみにペーストはWindowsのショートカットキーであるCtrl+vを使っても貼り付けられないので注意。(代わりにShift+Insertキーでできます。)
とりあえずマウスでやりましょう。後でこの辺は変更することもできます。

設定ファイルを作成

:mkv
(または:mkvimperatorrc)
と打ち込むと、"C:\Documents and Settings\ユーザーネーム"の位置に設定ファイルである"_vimperatorrc"ファイルが作成されます。
:mkvは一度やればOKです。
今後はこれをエディタで開き、設定を追加していきます。

なお、上でやったようにコマンドで
:set xxxxxxx=yyyyyyyy
などとすると一時的に設定ができますが、上記の_vimperatorrcに書き込まない限りは
Firefox次回起動時になると消えるもよう。
ですのでこれからもメニューバーを表示したい場合は、_vimperatorrcを開いて
set go=mTbr
などと書き込む必要があります。(このときはコロン:は要らない)
(※ただし:mkv!とびっくりマークをつけてやればこうした一時的設定を上書き保存してくれるようですが
これをやるとせっかく_vimperatorrcに書き込んだコメントなどが全部消されてしまうので
やらない方がいいです。消えました。)

プラグインフォルダを作成

"C:\Documents and Settings\ユーザーネーム\vimperator\plugin"
というフォルダを作ります。プラグインはここに.jsファイルを並べていけばOK.

プラグインのありかはいくつかあるようですが、
ここらへんを探してみるといいでしょう。
Vimperator Plugins in CodeRepos
/lang/javascript/vimperator-plugins/trunk – CodeRepos::Share – Trac

以上でインストールは終わりです。
次は使い方ですが、その前に以下でとかとか出てくるのでこれの意味を知るついでに用語集です。

用語集

    • コントロールキー(Ctrl)を押しながら、dキーを押す、という意味。Windowsなら普通Ctrl+dと書くのと同義。
    • シフトの場合は、そのまま大文字でDとすれば良い。(WEB上ではと書いてあるのも何度か見かけた気が...)
  1. ヤンク
  2. Vimp
    • Vimperatorの略。

キーを入れ替える

ここからはひとそれぞれになります。
自分は以下のようにしています。

:nmap j jに、「半ページ下へ」を割り当て(もとは「一行下へ」)
:nmap k kに、「半ページ上へ」を割り当て(もとは「一行上へ」)
:nmap l lに、「次のタブ」を割り当て。
:nmap h hに、「前のタブ」を割り当て。

人それぞれと言ったものの、一番使うと思われるこれらの動きが
デフォルトでは使いにくいので変えた方が挫折しづらくなると思います。
もともと本家のViではどのキーがどういう意味を持つのか、できるだけ矛盾しないように組みたい人はここが参考になります。
viキー操作メモ(Hishidama's vi Memo)


先頭の文字は、そのキーマップを適用するモードを表すようです。
(nmapとするとnormalモード、imapとするとinsertモード、 vmapだとvisualモード、 だけで適用される)
あと、mapの代わりにnoremapを使う場合もあるようです。
(nmapではなくnnoremap)
ちがいについてはこちら。
http://d.hatena.ne.jp/MOZZ/20090313


以上で一通り終わりかな?
ただしプラグインを入れたり_vimperatorrcを編集しないと
全然使いやすくないです。
なのでカスタマイズ加える前に挫折しないように注意。
それについては早めに別記事で。

今年作ったGreasemonkey,Stylishをまとめた

今年作ったものをまとめました。

Greasemonkeyスクリプト

Google Search - Sidebar for Greasemonkey

Googleの右側余白の有効活用を試みたスクリプトです。
f:id:blooo:20090929074143p:image

Google Reader - Colorize the Time for Greasemonkey

Google Readerの記事がどのくらい前の記事なのかをわかりやすくするスクリプトです。

f:id:blooo:20091127005532p:image ※11月26日の状態です。
YAjaro for Greasemonkey

Google検索結果のはてなブックマークなどのリンクを、元記事へのリンクに変えるスクリプトです。

どちらも同じページへ
Google検索 - ページの年齢をカラフルに for Greasemonkey

Google検索結果に(場合によって表示される)日付表示を、カラフルにしてわかりやすくするものです。

f:id:blooo:20091014175920p:image:h450:right ※10月14日の状態です。
Google検索 - もっと「検索ツール」 for Greasemonkey

Google検索の左側にある「検索ツール」を拡張するスクリプトです。
f:id:blooo:20091014175919p:image:h500

Google Reader - Auto Open & Fold Sidebar for Greasemonkey

Googleリーダーのサイドバーをマウスオーバーで自動開閉するスクリプトです。

はてなダイアリー - 詳細編集リンク for Greasemonkey

はてなダイアリー使用者に。その場編集だけでなく、詳細編集するためのリンクを取り付けます。
f:id:blooo:20091012185622p:image

はてなダイアリー - フォトライフは見づらいふ for Greasemonkey

はてなダイアリー上で(拡大表示したくて)画像をクリックすると、通常はフォトライフのページに飛ばされますが、それを画像そのものに飛ぶようにするスクリプトです。

楽天 - 「在庫無し」は少し消えてvol.2 for Greasemonkey

楽天の検索結果で、売り切れた商品を半透明にして区別しやすくします。
f:id:blooo:20091011153048p:image
f:id:blooo:20091011171427p:image

楽天 - Jump Links for Greasemonkey

楽天の商品ページ(大抵縦長でスクロールがきつい)に、価格や在庫表に簡単にジャンプできるリンクをとりつけます。
f:id:blooo:20091011153049p:image

Google Search - Remove Redirection for Greasemonkey

Google検索のトラッキング用リダイレクトを削除して、直接サイトに飛ぶためのスクリプトです。ちょっと高速化されるかもしれません。

Google Search - Japanese/English Link for Greasemonkey

Google検索に英語/日本語の切り替えリンクを付けます。

Google Search - "Quote" link for Greasemonkey

Google検索に「引用符付ける/外す」動作をする切り替えリンクを付けます。
f:id:blooo:20090818024047j:image

Stylishのスタイル

Gmail - Labels on the Right | userstyles.org

Gmailのラベルを右に押しやるスタイルです。

Gmail - Simple Header | userstyles.org

Gmailのヘッダをシンプルにするスタイルです。

Gmail - Slim Sidebar (Fixed) | userstyles.org

Gmailのサイドバーをスリムにした上で、スクロールしてもついてくるようにしたスタイルです。

Gmail - Vertical Multiple Inboxes Cleaner | userstyles.org

Gmailのマルチ受信トレイを、ちょっとすっきりさせるスタイルです。

Google Bookmarks & History - Simple Header | userstyles.org

GoogleブックマークとWEB履歴を、ちょっとすっきりさせるスタイルです。

Google Maps - Simple | userstyles.org

Googleマップを、ちょっとすっきりさせるスタイルです。

iGoogle - Simple Header | userstyles.org

iGoogleを、ちょっとすっきりさせるスタイルです。

Google Reader - Folded "Expanded View" | userstyles.org

Googleリーダーの「全文表示」を「リスト表示」っぽく表示させてマウススクロールを使おうとするスタイルです。

Neat Statusbar Icons | userstyles.org

ステータスバーのアイコンを、ちょっとすっきりさせるスタイルです。

RTM - Sidebar More Spacious | userstyles.org

Remember The Milkをサイドバー(もしくはiGoogleガジェット)で使っている方に。ちょっとすっきりさせるスタイルです。
f:id:blooo:20091007135320p:image

来年あったらいいなと思うもの

もちろん誰かに作ってほしいからです。

Google検索結果で、本文にリンクをつけたい

Googleの検索結果に出てきた文章を見てリンククリック→ページに飛んだ後にまたその該当箇所を探さなきゃいけない。・・・というプロセスをなくしたい。
そこで、検索結果のページ説明文自体にリンクをつけたい。("..."とかの区切り文字で分けて各部分をリンク化できたら)。そしてそこをクリックしたら、ジャンプした先でその部分に合致するところに自動的にスクロール・ハイライト。

faviconizeを改良したい

faviconを付けたい場所がxpathひとつじゃあらわせなくて困る場合があるので(Google Newsとか)
複数xpathで指定できるようにしたい。(根本的に変更が必要かも)
あと、AutoPagerizeには対応しているものの、追加されたページにも再適用する問題があるようなのでこれを改良したい。
あとちょっとずれるけれど、faviconizeを応用すればwedata管理の「あらゆるところにはてブ数をつける可能性を秘めたGreasemonkeyスクリプト」とかも作れそう。

ページ内にある検索フォームとツールバー上の検索ボックスを連動させたい

検索エンジンとして登録しなくても、自動的にページ内の検索フォームを取得して検索してくれるようなもの。
イメージはこんな感じ。

[          ] [           ] [                    ]
既存の検索欄  ページ内フォーム検索欄 ロケーションバー

エンター押すと今表示しているページ内の検索欄を自動で探してきて、それを使って検索する。
…うーんちょっと無理があるかなぁ。Vimperator使うか...

ツリー型タブの下余白を有効活用したい

タブ数が少ない時は下の余白エリアが活用されていないから、ここにサイドバーを表示させるとか良い方法はないかな。

ニュースを流したい(RSSバー)

ツールバー上でニュース(RSS)を垂れ流すアドオンみたいのが欲しい。
電光掲示板みたいな感じで右から左にながれていくイメージ。

OKwaveは兄弟サイトがたくさんあるが、リダイレクトしたい。

Google検索上のリンクを、YajaroみたいにすべてOKwave教えてGooに一本化、転送したい。

通貨計算を簡単にしたい

ドルとかユーロとか通貨を表す文字列を範囲選択して、右クリックから
日本円に変換するGreasemonkeyスクリプトが欲しい。

iGoogleのタブバー問題を解決したい

iGoogle - Revert to old 'Classic' Themeに結構問題があるので、
改変するか、追記分を作るか、自作したい。

GoogleサイドバーにWikipediaを表示するようにしました

以前作成したGoogleサイドバーに、
Wikipediaもサイドバーに載せて欲しいとの要望が来ていましたので追加致しました。

更新はこちらから。
Google Search - Sidebar for Greasemonkey

問題点

Wikipediaを追加したことで、サイドバーが長くなりすぎやすくなりました。
サイドバーがメインの部分より長くなると崩れます。
(「何か+wikipedia」とかで検索するとわかります)

一応、応急処置としてはGoogleの一回の検索件数を10件から20件に増やせば
ほぼ発生しなくなります。

Aptanaを使う

PHPAdobe Airの開発環境として、Aptanaを使用してみることにしました。(Windows)

インストールから設定まで

PDT+AptanaでPHP開発環境を構築する on Windows7 - Triplex Systems★開発メモ - livedoor Wiki(ウィキ)
このとおりにやったらできました。
紹介されている順番は重要です。
PDT(PHP用のプラグイン)をインストールする前に、日本語化(Pleiades導入)とJStyle導入をやってしまわないとうまくいきませんでした。
ちなみにzip・スタンドアロン版を使いました。

追記

PDTよりAptana PHPの方が(個人的には)使いやすかったです。導入方法は後述。

その他の設定

文字の色や背景色など、テーマを変更する(暗くする)方法

Aptana Studio IDE Dark Color Theme « NightLion
ここで.col(カラーcolorのcol)ファイルをダウンロードして
How To Install An Aptana Color Theme | Digital Oasis
の通りにインポートする。
他にもあるようです。
WebTecNote - AptanaをDreamweaverっぽい色にする

起動時に開かれるタブ"My Studio"を非表示にする方法

ウィンドウ→設定→Aptana→Startup Page
に項目あり。
How do I disabled "My Studio" / Questions / Discussion Area - Aptana Studio Support

行番号を表示する

ウィンドウ→設定→一般→エディター→テキストエディタ
に項目あり。

フォントを変更する(文字の大きさも)

ウィンドウ→設定→一般→外観→色とフォント→基本→テキスト・フォント
を変更。

キーを変更する

ウィンドウ→設定→一般→キー
に項目あり。
ただ、WindowsならAHKで変えた方が早いかも。(使っていない方はこの機会に)
タブ切替に関してはこちらを参考にしました。
Eclipse/エディタ上で右のタブ、左のタブに移動する方法 - TOBY SOFT wiki

追記:PDTは微妙

PDTは使いづらい。
まず、上にあげたやり方では色を変更することができず、その時点で挫折。
また、補完機能も使い方が違っていて、しかも(後述するように)遅いようだ。


ここでちょっと状況を整理してみます。
まず、Aptana1.5系ではAptana PHPというものが使え、JavascriptやHTMLと同様の感覚で使えたらしいです。
つまり、Aptana PHPとPDTの2択だった。
しかし、Aptana 2.0になってから、PDTに一本化するらしく(Aptana)、Aptana標準のPHPプラグイン?ではなく、サードパーティのを使うような格好みたいだ。
その理由としては


We believe that having a single plugin will be best for the PHP developers community, and look forward to a long and productive relationship with the PDT team.
らしい。その考え方はもっともで、


でもやっぱり不評なようで、嫌な人もいるみたい。
PHP code completion (Aptana Studio 2.0.2 - PHP Plugin) / Problems / Discussion Area - Aptana Studio Support
これによると、PDTは補完も遅いし、メモリも使う?ようだ。

そして、公式には「PDTじゃなくてApatana PHPを使いたいって人は好きなだけ1.5系を使ってればいいよ」と言っているようだが、実はAptanaPHPは2.0にもインストールできるみたいです。


やり方は、上記ページのコメントより。
ヘルプ→新規ソフトウェアのインストール
→「サイトを入力または選択」のところにhttp://update.aptana.com/install/php/と入力し「追加」を押す
→名前を適当に(Aptana PHPとでも)入れる。
あとは、適宜チェックマークを入れるなどして「次へ」をたどっていき、しばらくしてインストール完了したら再起動すればOK.


今後はAptana PHPの発展は望めないわけだし、
これでは一時的な解決にしかならないのだろうけど、とりあえずこれで行きます。


あと、一度PDTをインストールしてしまうとうまくアンインストールできなかった?ようでAptana PHPを入れるのに失敗しましたので、最初から全部やりなおしました。

結論

PDT+AptanaでPHP開発環境を構築する on Windows7 - Triplex Systems★開発メモ - livedoor Wiki(ウィキ)
このページを参考にして、最後PDTを入れるかわりにAptana PHPを入れる。

追記

行を折り返し表示にすると重くて使い物にならないことが判明した。残念だけどあきらめます。