ブラウザのテキスト入力を好みのエディタで

Written by @dr_taka_n at 2009/11/25 20:38 [, ]

“It’s All Text!” を使ってみることに

最近になってこんな便利なものがあることに気づいた。。

Web アプリケーションはホントに便利になり、大半のことはブラウザで行えてしまう。

ただ・・・wiki、ブログ、tracking system などテキストを入力する機会が多いアプリを扱う際には、ブラウザのテキストボックスの入力欄ではちょっとストレスが溜まる。
最近はそれを補うワードプロセッサーのような機能を提供するものもあるが、好みのエディタで編集したいという欲望は抑え切れない。

と、Radiant CMS の screencast を見ていた時にテキストボックスの編集を TextMate で行っているものがあった。そういうツールが既にあるんだ!ということでちょっと調べてみた。

という Firefox のアドオンもあるようだ。
他にも、textserver というものがある。

好んで使用しているのは Mac OS なのだが、Windows も使う必要がある。両方でうまく動作したのが It’s All Text! の方だったので、しばらくこちらを使っていくことにした。

ブラウザのテキストエリアを Emacs で編集

エディタは Emacs である必要はないのだが、大半のこと Emacs でやってしまっている身としては、Emacs が使えると非常にありがたい。
他エディタでも同様のことは可能だが、テキストボックスに入力するテキストの入力フォーマットに合わせて Emacs 側で編集モードをかえて編集できるのは便利だ。 Markdown であれば、Emacs markdown-mode、HTML であれば nXhtml - an Emacs mode for Web Development などという感じ。非常に快適だ。

インストールと設定

Firefox へのインストールは、下記から通常の手順で実施する。

アドオンの設定には、以下の設定を行う。

It's All Text Setting

上記は、Mac OS X の Carbon Emacs をエディタとして使用する場合の設定。上記のエディタのパスは汎用的なものではない。理由については後述する。

既に起動している Emacs のフレームのバッファを使用する

Carbon Emacs のパスは、/Applications/Emacs.app/Contents/MacOS/Emacs となるので、これを指定してあげればいいのだが、これだと “It’s All Text!” を使う度に、新たにフレームから立ち上げてしまう。Emacs は常に立ち上っているので、編集の度にフレームが複数上がるのはメンドい。既に起動している Emacs のバッファに表示させるようする。

こういう時には、Emacs Server/Client を使えばよいようだ。

エディタのパスには、

  • /Applications/Emacs.app/Contents/MacOS/bin/emacsclient

を指定しておいて、Emacs 側では、Emacs Server を起動しておく。

M-x server-start

常に起動させるようにするには、.emacs なりに、

(server-start)

を記入しておく。

ただ、1つ問題が・・・
何故か設定画面にて、emacsclient のフルパスが保存されない。理由はよくわからないが。

仕方ないので、自身のホームディレクトリ配下の bin 配下に上記のシンボリックリンクを用意して、それを参照させる。

$ cd ~/bin
$ ln -s /Applications/Emacs.app/Contents/MacOS/bin/emacsclient emacsclient

これで、最初の設定画面のエディタのパスに /Users/taka/bin/emacsclient が入ることになった。

Emacs Client からバッファを開いた場合には、C-x # でそのバッファを終了させるのがお行儀のよいやり方。

使い方

テキストボックスにカーソルを持っていくと、デフォルトでは右下(設定で変更可能)に “編集” ボタンがでるので、それをクリック。設定したエディタがアクティブになる。

マウスでわざわざクリックしなくても、ショトカットキーも割り合てることもできる。こちらも設定画面にて設定。

It's All Text! Button

以下は、エディタ(Emacs)側で編集を行っている画面。エディタ(Emacs)で保存を行えば、それがブラウザのテキストボックスに反映される。

It's All Text! Edit

もっと早く知っておけばよかった。。

blog comments powered by Disqus