Pastalablog in はてな

時代はブログ! 日記もあるよ→http://pastak-diary.hatenadiary.com

GyazoをSpotlight風のUIで検索できるElectronアプリを公開しました。ブラウザ拡張もあるよ。

過去にSpotlightプラグインを組み込むFlashlight向けにIvySearchを検索する のを書いたことがあった*1のだけど、Yosemiteになってから動かなくなってどうやら今後もFlashlightは開発をしなさそうな雰囲気なので、先日行われたバイト先のハッカソンを利用してElectronを使ってSpotlight風に扱えるアプリケーションとして書き直したので紹介します。

Gyazo

NinjaユーザーじゃないとIvySearch有効にならないので利用できないのですが、偶然今日からIvySearchが全ユーザーに解禁されているので皆さん利用できると思います。

これは何

MacOSXSpotlightのようなUIでIvySearchを検索して結果をクリップボードに保存できるアプリケーションです。

Gyazo

クリップボードにはURLとHTMLと画像Blobが同時に入ります。

使い方

  • https://github.com/pastak/gyazotlight/releases から 自身のプラットフォームに対応するzipをダウンロードして解凍。
  • Gyazotlight.app / .exe などを起動
  • MacOSXの場合はネットワーク受信接続〜が表示されるので「許可」 Gyazo
  • Gyazoの画面が表示されたらログインしてください。(ログイン後自動で閉じます)
  • 右上に忍者が表示されるので、そこから起動したり呼び出し用のショートカットキーを設定することができます。
    • 初期状態だと Control+Shift+G で呼び出すことが出来ます。

ChromeFirefoxから利用する方法

Gyazo

Chrome Extensionと連携することでブラウザ上でテキストを編集しているところにGyazotlightを介してGyazoのURLを挿入することが出来ます。

Install for Chrome

Install for Firefox

使い方

  • テキスト入力中に Control + Shift + U を押すと Gyazotlight が起動するので適当な画像を選ぶ。
  • カーソル位置にGyazoのURLが挿入されます。

おまけ: ブラウザ拡張から呼び出す仕組み

1passwordのブラウザ拡張がネイティブアプリを呼び出す仕組みになっているので、どうなってるのか追いかけたらWebSocketを利用していたので少し真似してみた。

  • Electronアプリケーション内にwebsocketサーバを立てる
  • ChromeExtensionからwebsocketで接続
  • Electronにメッセージが飛んできたらGyazotlightの画面を表示
  • 結果をwebsocketで返す
  • ChromeExtensionで結果を受け取ってカーソル位置に挿入

websocketなので他のブラウザ拡張とかアプリケーションから利用したい場合も比較的簡単だと思います。

その他

細かい使い方はGitHubに書いてあると思います。

MacOSXでは動くのを確認してますが他のプラットフォームでは確認してないので何かあればissueで教えて下さい。PRも歓迎です。