Atomで選択したテキストをHTMLタグで囲むコマンドを作りました

Atomで選択したテキストをHTMLタグで囲むコマンドを追加しました。
こんな感じで動作します。

1. タグで囲みたいテキストを選択し、cmd+ctrl+Tを押すとコマンドが実行され、テキストが<xxx>〜</xxx>で囲まれる（ショートカット設定方法は後述）

2. コマンド実行後、「xxx」が選択された状態になっているので、タグ名を入力する

• 複数選択も可能です
• 複数行を選択した場合は、選択されたブロックがタグで囲まれます

コマンドの追加方法

Atomのメニューから「Init Script…」を選択してスクリプトファイルを開き、以下のスクリプトを追加します。

encloseTag

function encloseTag(){

	var editor = atom.workspace.getActiveTextEditor();
	var selections = editor.getSelections();

	selections.forEach(
		function(selection){

			var text = selection.getText();
			var tagged_text;

			//複数行選択されている場合は改行を追加
			if(text.match('\n')){
				tagged_text = '<xxx>\n' + text + '</xxx>\n';
			}
			else{
				tagged_text = text.replace(/^(\s+)?/, '$1<xxx>') + '</xxx>';
			}

			var options = {
				'select': true
			};

			//タグで囲む
			selection.insertText(tagged_text, options);

			//インデントを整える
			selection.autoIndentSelectedRows();

		}
	);

	//xxxを選択する
	var tagname_ranges = [];

	selections.forEach(
		function(selection){
			editor.scanInBufferRange(
				/xxx/g,
				selection.getBufferRange(),
				function(obj){
					tagname_ranges.push(obj.range);
				}
			);

			selection.clear();
		}
	);

	editor.setSelectedBufferRanges(tagname_ranges);

}

init.jsの最後で、追加したスクリプトをコマンドとして登録します。

atom.commands.add("atom-text-editor", {
	"EncloseTag": encloseTag
});

コマンド追加を反映するため、一度Atomを再起動します。

ショートカットの登録

次に、ショートカットを登録します。（この段階でもコマンドパレット cmd+Shift+P から「EncloseTag」と入力すれば、実行できます。）

Atomのメニューから「Keymap...」を選択、「keymap.cson」を開き、以下のコードを追加します。

"atom-text-editor":
    "cmd-ctrl-t": "EncloseTag"

わたしはショートカットの競合がしにくく、比較的押しやすい「cmd+ctrl」のコンビネーションをAtomでは好んで使っています。（「T」はタグの頭文字です）

これでコマンドの登録とショートカットキーの登録は完了です。

AtomでHTMLコーディングをされている方のお役に立てれば幸いです！