けんごのお屋敷

2014-03-03

Chrome Extensionの話をしよう。ようこそ Hometype が創るマウスレスの世界へ。

vi のようなキー操作で Google Chrome を操作できるエクステンション Hometype の紹介をしたいと思います。元々はエクステンションの作り方の勉強をするために始めた Hometype でしたが github にソースコードを置いて自分が使いやすいようにいろいろ作ってるうちに、会社の同僚が何人か使い始めてたのでとりあえず公開しても良いかなと思って、先日バージョン 0.0.1 を Chrome ストアへ登録しました。ただ実際は、まだ実験的な機能も多く、バグも多く潜んでいると思いますし、テストもないし、最低限の機能しかないので、既存の同類のエクステンションに比べればまだまだ発展途上ではありますが、自分の中でやりたいことはいっぱいあるので開発はずっと続けていく予定です。

Hometype とは

先にも紹介しましたが vi のようなキー操作で Google Chrome を操作できるエクステンションです。バージョン 0.0.1 では以下のキーバインドが定義されています。

  • j C-e 下スクロール
  • k C-y 上スクロール
  • C-d 半ページ下スクロール
  • C-u 半ページ上スクロール
  • C-f 1ページ下スクロール
  • C-b 1ページ上スクロール
  • gg 先頭へスクロール
  • G 最後へスクロール
  • H 前に戻る
  • L 次に進む
  • x 現在のタブを閉じる
  • C-p 前のタブへ移動する
  • C-n 次のタブへ移動する
  • I 画面上の最初のテキストエリアにフォーカスする
  • A 画面上の最後のテキストエリアにフォーカスする
  • u 直前に閉じたタブを開き直す
  • U 最近の閉じたタブを検索して開き直す
  • C-h 最近の履歴を検索して戻る
  • b ブックマークを検索して現在のタブで開く
  • B ブックマークを検索して新しいタブで開く
  • f リンクを現在のタブで開くヒントモードへ移行
  • F リンクを新しいタブで開くヒントモードへ移行
  • i a インサートモードへ移行
  • : コマンドモードへ移行
  • v ビジュアルモードへ移行

※キーバインドは自分が使いやすい設定になっているので、他の人も使いやすいかというとわかりません。自分でキーバインドを設定できる機能はつけるつもり。

便利な機能

Hometype の機能の中でも、他の人に便利かどうかは置いといて自分が欲しいなあと思ってつけた機能がいくつかあるのでその辺も紹介したいと思います。ただし、どれもまだ Experimental な機能で、きちんと動作しない場合もあります。

ヒントモードセレクトボックス

以下は Facebook の新規ユーザー登録フォームでヒントモードに入ったキャプチャです。

ここで t j を押下してセレクトボックスを選んだ時に、以下のようにセレクトボックスの要素がポップアップされてヒントモードが継続します。

ここで f を押下すると Jan が選択された状態になります。

ビジュアルモード

v を押下することでビジュアルモードへ移行することができます。たとえば以下のキャプチャは PHP のマニュアルのサイトです。

ここで v を押すと

このようにヒントチップが表示されます。そして e を押下すると

このように該当要素に対してフォーカスがあたって、選択・コピーできるようになります。FireFoxのキャレットブラウズモードのようなものです。キャプチャのようにコードスニペットなどがあってそれをコピーしたい時によく使います。

ブックマーク・履歴・閉じたタブの検索

b B を押すとブックマークを C-h を押すと履歴を U を押すと閉じたタブを、それぞれ検索できるようになっています。たとえば B を押下すると画面下部に灰色のバーが表示されます。そこでなにかテキストを入力すると

このようにテキストにマッチする候補が表示されます。候補間の移動は C-n 及び C-p で出来ます。候補から開きたいブックマークを選択して Enter を押下すればそのページが開かれます。履歴と閉じたタブの検索も同様の操作でページを開くことができます。

既知の問題点

Hometype バージョン 0.0.1 では以下のような問題点があることがわかっています。

インサートモードへの自動移行

Hometype は vi のように内部で現在のモードを保持しています。通常はノーマルモードなのですが、テキストフォームにフォーカスした時はそれを認識して自動的にインサートモードへ移行します。インサートモードの時は基本的にキーバインドは無効になり、文字の入力ができるようになります。ただし、テキストフォームにフォーカスしているということを Hometype が認識しきれずにノーマルモードのままになる場合があります。そうなると、文字を入力したいのにノーマルモードでコマンドが実行されてしまうことになって、コマンドがバインドされているキーは、入力ができなくなってしまいます。

このような場合の対処として i または a で強制的にインサートモードへの移行を行えます。

テキストフォームにフォーカスしてもインサートモードとして認識してくれない場合は強制的にインサートモードへ移行すれば問題なく文字を入力することができます。ノーマルモードには Esc もしくは C-c で戻れます。

ヒントモードセレクトボックス

セレクトボックスの要素がポップアップされてヒントチップから選択できる機能ですが、セレクトボックスの要素数が多すぎると枠からはみ出してしまい、はみ出した部分は見えなくなってしまいます。現時点での対処法はあきらめてマウスで選択するしかありません。

終わりに

まだ発展途上の拡張機能ですが、これから良くなります。たぶん。そしたら使ってくれる人も増えるかもしれない。Hometype は github のパブリックリポジトリでオープンに開発していますので、最後にそこへのリンクを貼って終わります。

https://github.com/tkengo/hometype

  • このエントリーをはてなブックマークに追加