CtrlPでcdnjs.comのURLを入力するctrlp-cdnjsを作った

Vim

試しにちょろっとHTMLとJavaScript書いて確認とかしたいときに、jQueryとかのライブラリをダウンロードして用意するのは面倒なのでどっかのCDNから拝借することが多いんだけど、このURLを毎回ググってコピペするのがいい加減だるいのでVimのCtrlPで選択して入力できるようにしてみた。
extensionの作り方がよくわからなかったのでmattnさんのextensionをパクり参考にした。



https://github.com/pasela/ctrlp-cdnjs


RetinaなせいなのかLICEcapでキャプチャすると滲んだみたいになる。もっと綺麗に撮る方法ないかな？

使い方

このextensionはファイルを開いたりするわけではないので、ちょっと行儀悪いと思いつつも以下のように割り当てを変えてある。

キー 動作
Enter URLを挿入する
Ctrl+T scriptタグ（cssの場合はlinkタグ）を挿入する
Ctrl+S URLスキームをhttp→https→scheme-lessと切り替える
Ctrl+V cdnjs.com上のライブラリページをブラウザで開く(要open-browser.vim)

挿入されるURLのスキームはデフォルトではhttp:になってて、Ctrl+Sを押すごとにhttps:、scheme-less(//example.comみたいなやつ)とローテートする。

苦労した点

jquery-なんちゃらがくっそ多くて、ただのjqueryが選択できない。
CtrlPは該当する候補のうち一部しかリストに表示されないので、

jquery-gamequery (v0.7.0)
jquery-color (v2.1.2)
jquery-easing (v1.3)
jquery-footable (v0.1.0)
jquery-browser (v0.0.6)

みたいになっちゃってjqueryが画面内に出てこない。
バージョンまで指定すればマッチするけど、バージョンとか知らんし。
正規表現モードにすればマッチ可能だけど面倒くさいしユーザに委ねられるのが気に入らない。
g:ctrlp_match_funcでマッチング処理をいじるというのも考えたけど、これもユーザ側でグローバルに設定する機能なのでダメ。


で、うまい解決方法が浮かばなかったんだけど、とりあえずリストをソートしておくことで誤魔化してみた。
候補はリスト順に出てくるみたいなので、ソートしてjqueryが先頭に来るようにしてあればjqueryと入力した時点でとりあえずjqueryが近い位置に来る。


extension毎にマッチング関数が定義できたり、前方一致でマッチングできればよかったかも。

ToDo

ライブラリのバージョンを選べるようにしたい

cdnjs.comには過去のバージョンなどもあるので、特定のバージョンも指定できるようになるといいかもしれないと思ったのだが、うまいインターフェイスが思いつかなかった。
全バージョンを候補に並べると鬱陶しいし、前述の表示数問題があるので絞りきれない。


バージョン絞り込み用のCtrlP呼び出しに繋ぐというのも考えたけど、できるのかわからないし微妙な感じがしたので試してない。

複数ファイル収録されてる場合に対応したい

ライブラリによっては複数ファイルだったり.jsと.cssがセットになってるものなどがあるので、そのへんもまとめて挿入できたりするといいなと思った。
しかしminimizeしてあるやつとそうでないやつとか、.mapとか、css内で使ってる画像ファイルだとかが混じってたりして、どれが必要なファイルか判別できなかったので諦めた。
そして代わりにCtrl+Vでライブラリの詳細ページを開けるようにした。そこで必要なやつはコピーしてもらおうという逃げ。

複数選択して一括挿入したい

例えばjqueryとjquery-uiを選択してまとめて挿入とかしたかった。
opmulというオプションを指定するとCtrlP標準のファイル選択みたいにCtrl-Zで複数選択できるのはわかったんだけど、ハンドリング方法がわからなかった。

ライブラリ情報をキャッシュしたい

毎回cdnjs.comにお伺いするのもあれなのでキャッシュしたかったんだけど、CtrlPのキャッシュの仕組みがよくわからなかったし、F5押した時のハンドリングもわからなかった。独自に実装するしかない？


自分がよくわかってないだけかもしれないけど、どうも組み込み機能では使えるけどextensionでは使えない機能とかあるっぽい。