Edited at
VimDay 22

Vimでブラウザを操る

More than 3 years have passed since last update.

この記事はVim Advent Calendar 2014 - Qiita 22日目の記事です

21日目の記事は @mitsuse さんの非英語ネイティブでも Vim で快適に英語を書きたいでした

Vimアドベントカレンダーですが、ちょっと趣向を変えてVimperatorという、(常にvimキーバインドが良い && キーボードから手を離したくない人)に便利なFirefoxのアドオンを紹介します


いいところ

vimキーバインドでブラウジングが出来るようになります

例えばデスクトップアプリのKobitoとかYoruFukurouだとjkで上下に移動することが出来ますが、そんな程度ではありません

今のところマウスを使うのは


  • テキストをコピーする


    • これはややめんどくさいので



  • YouTubeなどのフレーム間移動(Embedモードからの脱出)


    • vimperatorでも出来るはずだが手元ではうまくいかない


      • 誰か教えてください





  • 片手で操作したい時


    • ご飯食べながらとか



くらいになりました

もちろん個人差はあります


簡単な使い方


移動



  • j, k: 上下のスクロール


  • C-f, C-b, C-d, C-u: 0.5/1画面分の上下スクロール


  • gg, G, 10G: ページの先頭、末尾、上から10%の所にジャンプ


  • gt, gT: 左右のタブに移動



    • C-n, C-pでも可能




  • /: ページ内検索



    • n, Nでヒットした単語にジャンプできる



移動はこんな感じ


ページの移動



  • f: 表示領域内のリンクに番号を表示する


    • 表示された番号を入力するとクリックしたことになる


    • Fだと新しいタブで開く




  • ⌥-←, ⌥-→: 履歴の戻る/進む


  • d: ページを閉じる


  • u: 閉じたページを開き直す


  • t, o: ページを開く



    • t hogeとタイプするとhogeでWeb検索する


      • urlを入れると、そのurlを開く




    • oだと今いるタブに、tだと新しいタブに結果を表示する



リンクの開き方はこんな感じ


その他



  • :: コマンドモード


  • gi: 1つめの入力ボックスにフォーカス



    • 3giで3つめにフォーカス

    • google検索など、検索ボックスに瞬時にフォーカス出来て便利



  • 補完の選択: TabS-Tabで選択できる

大体これくらいおぼえておけば普段は問題ないでしょう

個人的には入力ボックスへのフォーカスがめっちゃ便利だと思っていて、こんな感じにフォーカス出来ます


設定

本家vimと同様、vimperatorもカスタマイズすることが出来ます


設定ファイル

~/.vimperatorrcに記述できます

自分で使っているものとして


~/.vimperatorrc

" スクロールの端などの際に出るbeepをoff

set nobeep

" デフォルトの検索エンジン
set defsearch=google

" 検索キーワードのハイライト
set hlsearch

" j/k でのスクロール幅を 1行 から 3行 に変更
" map j 3jとかすると無限ループして死ぬ
map j 3<C-e>
map k 3<C-y>

" ddでタブを閉じる, dでは何もしない
no dd :tabclose<CR>
map d <NOP>

" h/lに戻る/進むを割り当て
map H <A-Left>
map L <A-Right>

" H/Lでタブ移動
map h gT
map l gt
" Shift + ←/→ で現在のタブの位置変更
map <S-Right> :tabmove! +1<CR>
map <S-Left> :tabmove! -1<CR>


などがあります

キーバインドを自由に設定できるのはストレスが無くて良いです


プラグイン

これも本家vim同様、様々なプラグインを導入することが出来ます

こちらはブラウザへの操作をするためにJavaScriptで記述します

~/.vimperator/pluginディレクトリにjsファイルを保存すれば読み込みます

vimpr/vimperator-pluginsに大量においてあります

プラグインについてはほんの少しはてブを検索するVimperatorプラグインを作った - petitviolet_blogに書いたことがあります

例えば、:ht vimとするとはてなブックマークでvimタグがついたものを検索できるようにするプラグインだと下のように書けます


hatenaBookmarkTagSearch.js

(function() {

liberator.modules.commands.addUserCommand(
["hatenaTag", "hatena", "ht"],
"search from hatena bookmarks by tags",
function(args){
if (args.length === 0) {
liberator.echo('input a query!');
return false;
}

// make "and" query
var query = args.join("+");
var hatenaTagUrl = 'http://b.hatena.ne.jp/search/tag?safe=on&sort=recent&q='
// open in a new tab
liberator.open(hatenaTagUrl + query, liberator.NEW_TAB);
return false;
},
{},
true
);
})();


あとよく使うのとして、SlideShareSpeaker DeckのスライドをCtrl-l/Ctrl-hで進む/戻るにマッピングするプラグインを書いたりしました

この辺の自分で作ったのはpetitviolet/vimp-pluginsに置いてあります


作り方

更新が止まってしまっていますが、addUserCommand_for2.0pre - Vimperator を参考にプラグイン開発が出来ます


所感

最近はGoogleChromeが人気で、Firefoxをまわりで使っている人がやや少なくなってきているように感じますが、vimperator使ってめっちゃ便利にFirefox使いましょう

ちなみに、GoogleChromeだと

みたいなのがあったりもします


明日

明日の記事は @s_of_p さんです