読者です 読者をやめる 読者になる 読者になる

kick the base

好きな映画、音楽、マンガ、プログラム、デザイン、3DCG、ゲームのこと。

Mac/JXA: 選択したテキストをショートカットでいつでもどこでも「突然の死」に変換する

Mac JavaScript

今回はMacで選択したテキストを突然の死に変換する方法について解説します。使用している技術はサービスとJXA(JavaScript for Automation)です。

突然の死とはAAの一種であり、下記のようなものです。

f:id:kickbase:20161111232741j:plain

ぼくは主にTwitterやコミュニケーションツール・チャットツールなどにおいて突然の死をよく使います。皆さんもTwitterなどで見かけたことのある方も多いのではないでしょうか。

フキダシの装飾部分を手作業で作るのはコストが高すぎるので、ツールを自作しました。

目次

ツールのデモ

完成したツールのデモはこちらです。SafariでWeb版Twitterを操作しているところで、テキストを選択後control+cmd+Sで変換しています。

f:id:kickbase:20161111233109g:plain

環境

OS X 10.11.6

作成背景と技術選定

テキストを入力すると突然の死に変換してくれるWebサービスもありますが、わざわざ該当のページに移動してコピー、該当のSNSやチャットツールに貼り付けるのは手間なので避けたいところです。

よって下記項目をクリアできるものを探すことにしました。

  • アプリケーションを問わず幅広い場所で使いたい
  • テキストを選択後、ショートカットキーで変換したい
  • ツール自体は慣れ親しんだスクリプト言語で作成したい

これらを満たすものとして、OS Xが提供するサービスとJXAを用いることにしました。

本ツールはもともと僕がメインで使っているブラウザであるFirefoxのプラグインとして作成したのですが、各ブラウザを行き来する事が多いので作り直しました

ツールの作成

Automatorの使い方やサービスの作成方法、ショートカットの登録方法は以前の記事で詳しく解説したのでをご参照ください。

本記事では

  1. 選択したテキストを定型文で置き換える
  2. 選択したテキストを簡単に加工してみる
  3. 選択したテキストを突然の死で置き換える

という順番で解説していきます。最初に簡単なものを、次に複雑なものをという感じです。

下準備

Automatorを起動しサービスを新規作成したら、下記設定を行います。

  • サービスは、次の項目を受け取る: テキスト
  • 検索対象: すべてのアプリケーション
  • 選択されたテキストを出力で置き換えるにチェック

これで選択したテキストを好きなように加工できます。

f:id:kickbase:20161111224930j:plain

選択したテキストを定型文で置き換える

ここから受け取った「選択されたテキスト」を置き換えていきましょう。

「JavaScriptを実行」アクションを繋げて下記コードを記載してみましょう。

function run(input, parameters) {
    return "定型文";
}

Automatorの設定はこんな感じです。

f:id:kickbase:20161111224931j:plain

入力(ここでは選択したテキスト)はrun関数の戻り値で置き換えられます。本例では入力は利用しないため直値で"定型文"という文字列を返しています。

f:id:kickbase:20161111224934g:plain

選択したテキストを簡単に加工してみる

入力であるinputの文字列表現、input.toString()の前後に"どうも、""です。"を連結しました。

ここまでも簡単ですね。

function run(input, parameters) {
    return "どうも、" + input.toString() + "です。";
}

f:id:kickbase:20161111224933g:plain

選択したテキストを突然の死で置き換える

最後に今回の本題、突然の死への変換コードをご紹介します。内容も簡単ですし、短いコードなので追いやすいでしょう。

コードについて簡単に解説します。

getLengthByteメソッド

String.prototype.getLengthByteの部分で文字列型のインスタンス全てにgetLengthByteメソッドを生やします。

これは文字列自身のバイト数をカウントするメソッドです。単体では下記のように使います。

String.prototype.getLengthByte = function () {
    var self = this,
        count = 0,
        char,
        i;
    for (i = 0; i < self.length; i++) {
        char = self.charCodeAt(i);
        if ((char >= 0x0 && char < 0x81) || (char == 0xf8f0) ||
            (char >= 0xff61 && char < 0xffa0) || (char >= 0xf8f1 && char < 0xf8f4)) {
                count += 1;
            } else {
                count += 2;
            }
    }
    return count;
};

console.log('abcde'.getLengthByte());     //5
console.log('オレサマツヨイ'.getLengthByte());    //7
console.log('ざわ…ざわ…'.getLengthByte()); //12

repeatメソッド

String.prototype.repeatの部分で文字列型のインスタンス全てにrepeatメソッドを生やします。

これは任意の文字列を指定回数だけ繰り返した文字列を返すメソッドです。単体では下記のように使います。

String.prototype.repeat = function (n) {
    return new Array(n + 1).join(this);
};

console.log('あ'.repeat(5)); //あああああ

suddenDeath関数

これが「突然の死」を作るメインの関数です。特に難しいことはしていません。

  1. 入力(選択されたテキスト)のバイト数をgetLengthByteメソッドを用いて調査します
  2. 上記を利用して装飾を加えていきます。ここでrepeatメソッドを利用しています

応用

選択したテキスト置換せず、加工後のテキストをクリップボードにコピーだけしたいというような要望にも簡単に応えられます。

ポイントは

  • 「選択されたテキストを出力で置き換える」のチェックを外す
  • 「JavaScriptを実行」アクションの次に「クリップボードにコピー」アクションをつなぐ

これだけです。設定の画像は下記の通り。

f:id:kickbase:20161113115119j:plain

操作動画は下記の通り。

f:id:kickbase:20161113115120g:plain

まとめ

文字列を置き換えるツールというのは使い方次第でパワフルな道具となります。

例えば下記のようにコメントボックスを整形する事もできるでしょう。

f:id:kickbase:20161114183943j:plain

皆さんもお好みのツールを作ってみると面白いと思います。