haya14busa

haya14busa’s memo

コードのエッジへ移動しろ！ Vim-edgemotion 作った

- -


この記事は Vim2 Advent Calendar 201714日目の記事です。

vim-edgemotion つくった


vim-edgemotion-demo
VimConf 2017 の t9md さんの発表 で紹介されていた、 Atom vim-mode-plus の機能の一つ, Edge motion を Vim に移植しました。
https://github.com/haya14busa/vim-edgemotion

Edge Motion とは?


Edge Motion は上下方向へのカーソル移動を拡張するモーションで、”コードブロック”のエッジ(端)へカーソルを移動させることができます。 ブロック内にいればそのブロックの端へ、すでにブロック端にいたりブロック外で実行すると次にぶつかるブロックの端までカーソルを移動します。
VimConf2017 でのデモ(本記事の冒頭のgif) でも直感的・視覚的に移動できてよさそう感は 伝わると思うのですが、個人的に便利だなぁと思うのはキチンとインデントされているコードであれば、 関数やifブロックを効率的に、しかも言語を問わずに移動できるところです。
edgemotion indent demo
GIF では Vim script の if-elseif-else 間の移動や、function-endfunction 間の移動を行っていますが、CでもGoでもPythonでもHaskell でも、様々な言語でこのインデントベースで次のエッジに飛ぶという カーソル移動は効果を発揮するかと思います。

vim-edgemotionにおけるコードブロックってなに?


edgemotion visualize
GIF にあるように、以下の正規表現でコードのブロックをヴィジュアライズすることができます。
 
1
2

" Code block regex: [^[:space:]][[:space:]]\ze[^[:space:]]\|[^[:space:]]
" :let @/ = '[^[:space:]][[:space:]]\ze[^[:space:]]\|[^[:space:]]' | set hls

要するに空白文字でないか、または非空白文字に挟まれている空白文字をコードブロックと見なしています。 これは例えば :let @/ = の空白がブロックとみなされないと、カーソルが思っても見ないところで止まったり、 予想以上のところまで移動してしまうことを防ぐためで、Atom vim-mode-plus の仕様にあわせています。
最初はそのヒューリスティックでいいのかな…という気持ちはありましたが、他にいい判定方法も思いつかなかったし仕方ない。 Edge Motion は説明なしに直感的・視覚的に使えると見せかけて仕様を理解しないと 驚いてしまうかもしれないというのがデザインの難しいところですね…

使い方サンプル


お好みのキーにマッピングしてください。僕は <C-j>/<C-k>にマッピングしてみた。
 
1
2

map <C-j> <Plug>(edgemotion-j)
map <C-k> <Plug>(edgemotion-k)

<Plug>(edgemotion-j) で下方向、<Plug>(edgemotion-k) で上方向にカーソルを移動します。

宣伝


vim-edgemotion は 今年僕も発表した VimConf 2017 の t9md さんの発表 から インスパイア… というかまるまるパクってVim plugin にポートしてできたプラグインです。
VimConf はエディタの垣根を超えるカンファレンスで奇しくも昨日の Vim2 Advent Calendar 2017 13日目の記事( vim-shiny という plugin を作った) も VimConf2017 で発表された vim-mode-plus にインスパイアされてプラグインを作っています。

宣伝2


また vim-edgemotion はもともと VimConf2017 開催中に30minくらいで作ったのですが、 あとで t9md さんに見てもらうとどうやら実装が違ったらしく、﹁その仕様はいいかもしれないけど それならedgemotion と名乗るな﹂とt9mdさんに怒られました(笑)。
結局自分でもオリジナルの仕様が良さそうということで今の仕様にその後変更しました。 この変更はつい[要出典] 先日 土善旅館 というにて開催された進捗合宿で ダメになるソファーでダメになりながら、ネコとペアプロすることで実装されました。
その様子です。

やっていくぞ〜💪🏻🐦 pic.twitter.com/jVQ8AEJ07l

— はやぶさ (@haya14busa) November 23, 2017

ねこちゃんとペアプロ pic.twitter.com/ZAZWGLJoMI

— はやぶさ (@haya14busa) November 24, 2017

セパレートキーボードでねこにゃんとペアプロうらやましい…😺✨ pic.twitter.com/oTpyb6oGi9

— はやぶさ (@haya14busa) November 25, 2017

進捗の鬼です pic.twitter.com/VaE0taLxAD

— はやぶさ (@haya14busa) November 23, 2017

進捗の鬼（浴衣 ver） pic.twitter.com/ak4XXbhFi0

— はやぶさ (@haya14busa) November 23, 2017

進捗の鬼（毛布ぬくぬくver） pic.twitter.com/v8s6FbhxCJ

— はやぶさ (@haya14busa) November 24, 2017

Vim進捗週末旅行@土善旅館についてあわせて読みたい

おわりに

  • Edge Motion は直感的・視覚的にカーソルの上下移動ができてなかなか可能性を感じるので使ってみてね
  • VimConf は来年の VimConf2018 もオススメ
  • 土善旅館 はネコにゃんとペアプロして積んでたタスクを崩せるので便利

Comments