Tag: CotEditor

CotEditorタグの付いた記事

CotEditor + MarkedでreST / Textile編集

以前当ブログで、CotEditor（テキストエディタ）とMarked（Markdownビューワ）を組み合わせたMarkdown編集環境を紹介したのですが、実は同じ組み合わせでreSTやTextileの編集環境を作ることも可能です。

つまり、CotEditorをreStracturedText (a.k.a. reST) もしくは Textileのエディタをして使い、Markedでそのプレビューを行います。

世の中Markdown編集ソフトというのは結構出てきているのですが、reStracturedText やTextileとなると、とたんにその選択肢は少なくなります。けっこう皆さんreSTやTextileに関してはしぶしぶコマンドラインでHTMLに書き出してブラウザでプレビュー、なんて原始的な方法を取っているのではないでしょうか。せっかくの軽量マークアップ言語、プレビューもスマートにいきたいものです。

そこでCotEditor + Marked。

おさらいをすると、MarkedとはMarkedown文書をリアルタイムプレビューするMac OS Xのシェアウェアです。詳しいソフトウェアの紹介は冒頭でリンクした当ブログの過去の記事に譲ります。MarkdownプレビューワというふれこみのこのMarkedですが、このソフトはレンダリング・プロセッサをカスタム設定できるので、そこにreSTやTextileのレンダリングエンジンを設定すれば実はそれらのプレビューが可能になるのです。

ただし、現時点でMarkedは複数のエンジンを同時に設定することはできないので、Markdown / reST / Textileいずれかの専用プレビューワとしてしか使用できません。その点はご注意を。

よって本稿は、MarkdownよりもreST / Textileがメインの人、もしくはMarkdown用エディタは別に整えていてよりニッチなreST / Textile用のエディタ+ビューワを探している人向けになります。

また、ここまで読んで気づく人は気づくかもしれませんが、Markedはエディタとビューワを分離させるのが売りのソフトウェアなので、エディタ部分は別にCotEditorでなくてもかまいません。ただ私が熱心なCotEditorユーザなのでCotEditorとの連携に絞って紹介します。他のエディタをお使いの方は適当に読み替えて下さい。

ということで、以下その設定方法を解説します。reSTとTextileの設定方法をまとめて書いているので、適宜必要な方を拾いながら読んで下さい。

ちなみに紹介した方法で実際に動くかは、一応手元 (OS X v10.8.2 + CotEditor v1.3.1 + Marked v1.4) で確認済です。

最近Pythonを書く人になったので、色々CotEditorのPython周りを整えています¹。ということで表題の通り、CotEditorで開いてるファイルをPythonの推奨コーディングスタイルであるPEP8のチェックにかけるCotEditorスクリプトを書きました。

あ、ちょっと、「CotEditorユーザだけどPythonなら関係ないや」なんて帰らないで！このポストの後半で、このスクリプトのソースを使ってCotEditorスクリプトを書くTipsをついでに共有したいと思ってます。

Check PEP8

PEP8の結果が表示されたCotEditor Script Error Window — CotEditorのスクリプトエラーウィンドウに結果を出力

ともあれ先にこのスクリプト自体の説明。

実行するとCotEditorのスクリプトエラーウィンドウに、ファイル名とともにCotEditorの最前面のウィンドウのPEP8テスト結果を出力します。メニューバーから実行できてわざわざターミナルに行かなくてもいいから便利。

当サイトのCotEditor用マクロ配布ページからダウンロードできます。インストール方法もこの配布ページを見て下さい。

CotEditor用マクロ -Goodies -Works //ヴォルフロッシュ

パスの設定

このスクリプト、たぶん環境によって違うのでPEP8へのパスを合わせる必要があります。スクリプトの頭のところに PEP8 っていう変数があるので、そこにPEP8へのパスを入れて下さい。単に 'pep8' でもいいかもしれません。わからない人はTerminalで which pep8 って入れればわかります。そもそもpep8が入っていない人はそれを（というかpytestを）インストールするところから始めて下さい。Mac OS Xには標準では入っていません。でもPython書くなら入れといた方がいいと思います。

reSTのシンタックス定義とかiniのシンタックス定義とか。

CotEditorで画像のbase64埋め込み

webサイトに画像を表示させるときに、HTMLやCSSで画像ファイルのパスを指定してを呼び出すのではなく、画像ファイルをテキスト形式にエンコードしてそれを直接ソースに記述するという方法があります。

たとえばCSSで画像を追加したいとき、普通は

h2::before { content:url(../images/file.png) }

のように、CSSファイルから挿入したい画像のファイルのパスを指定しますが、画像データをbase64という形式でテキスト化することにより以下のように書くことができます。

h2::before { content:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAALBJREFUeNpiZACCyorK/9LS0gzo4P379x/evn3rMGHihIsoEpMmTvr/588fDLx+/fr/3V3d7/Ny8/RhaplAxL9//xj+//+PgTk5ORmysrMEZGSkD+RkZ+sjafiLVcP3798Zdu7cySAtIyPAzMx8AKSWBdkGdODs7AyWA4Enjx8LENTAxsYGZzMyMjIQ1IAMYDYNUg2ijx4+ZOjp7sarARhKIEoc5HVxIOZnIA58AQgwABZHliIIeBqFAAAAAElFTkSuQmCC) }

これで、この場合は file.png という画像データをテキスト形式で記述したことになり、これ以上サーバに file.png のファイルを上げる必要もありません。

CSS/HTMLファイルに直接画像も記述してしまえばそこから"画像ファイルを呼び出す" というトラフィックがなくなるので、サーバ負荷の軽減・表示速度の向上に繋がる、というテクニックです。大きい画像はテキスト化するとえらいことになるので、リストのマーカー画像や繰り返しの背景素材のような小さな画像データに向いています。

まぁ、詳しくはその辺を丁寧に解説してるサイトを検索して読んでください(雑)。

本題は、「それをCotEditorでやるマクロを書いたから配布するよ」っていう方です。CotEditorのスクリプトメニューから実行するとファイルを選択するダイアログが出るので、挿入したい画像ファイルを選ぶとカーソル位置にbase64にエンコードされた画像データが挿入されます。Terminalを触ったりオンラインプログラムに頼ることなく、CotEditorだけで作業が完結するので、画像のテキスト埋め込みが気軽にできるようになるのではないでしょうか。

[screen shot] — screen shot: ダイアログから選択した画像をbase64エンコード

当サイトのCotEditor用マクロ配布ページからダウンロードできるようにしました。

CotEditor用マクロ -Goodies -Works //ヴォルフロッシュ

画像データのbase64化というのは実はSVGでラスター画像を扱う上で重要な要素で、このスクリプトもSVG Suite用に書いたものが元なのですが、多分SVGをCotEditorで書くより画像のCSSファイル埋め込みの方が需要があると思われるので、単発の選択画像をbase64にエンコードするだけの版を作成しました¹。良ければお使いください。

SVG Suiteに入っている版は画像の縦横のサイズも拾った上で<image>タグを生成します。

Marked 1.3.3

今日知ったMarkedというMacのソフトが便利。

なんてことない、Markdownのプレビューワだ。エディタではない、ただのプレビューワというところがポイント。既存のテキストエディタと併用することを想定して作られている。実際の使い方はサイトにある紹介ビデオがわかりやすいだろう。ファイルをドラッグ&ドロップするだけ。

編集中のウィンドウの横にコンパクトに開かれる — [screen shot] CotEditor + Marked

ただのプレビューワだからこその場所を取らないミニマルなUIが良い。プレビューワだからこその、控えめなウィンドウ幅でしかも画面の右寄りに表示されるのが良い。プレビューワだからこそのライブプレビューが良い。

適応スタイルはシンプルなプリセットがいくつかあるし、もちろん自分でCSSを書いて付け足すこともできる。HTMLの書き出しもボタン1つ。アウトラインとジャンプ機能もある。Markdown変換エンジンは好みのものを別途設定することもできる。

結局Markdownなんてプレーンテキストなんだから大げさに専用のエディタなんて使わずに気軽に普段使いのテキストエディタでやりたいのよ。そのための記法でしょ？あくまで用途によってはたまにプレビューしたくもなる、くらいで。

毎度のCotEditor+Markdownシンタックスで書いて、プレビューしたくなった時点でMarkedをラウンチ。

手抜きのためにMarked呼び出しはAppleScriptにやらせよう。これならMarkedをDockに入れておく必要すらない。

tell application "CotEditor"
    if exists front document then
        tell front document
            if coloring style is in {"HTML", "HTML5", "CSS", "JavaScript", "PHP", "SVG"} then
                -- reload Safari
                tell application "Safari" to do JavaScript "location.reload(true);" in document 1
            else if coloring style is "Markdown" then
                -- launch Marked
                set thePath to path
                tell application "Marked" to open thePath
            end if
        end tell
    end if
end tell

Preview.@r.scpt

プレビュー用のcontrol + Rで実行させるスクリプトを拡張してモードがMarkdownのときはMarkedが開くようにした（ちなみにHTMLとかCSSのときはSafariがリロードされる）。

AppleScript EditorにこのスクリプトをコピペしてCotEditorのScriptMenuフォルダ (~/Library/Application Support/CotEditor/ScriptMenu) に保存して下さい。ショートカットキーはスクリプト名の末尾 (この場合@r) で指定できます。

純粋にスクリプトメニューからMarkedを開きたいだけの場合は以下で。

tell application "CotEditor"
    if exists front document then
        tell front document
            set thePath to path
            tell application "Marked" to open thePath
        end tell
    end if
end tell

Preview Markdown.scpt

まぁMarkedは1度開いちゃえばあとはテキストエディタの方でファイルを保存するたびに連動して勝手にアップデートしてくれるからラウンチだけで良いんだけど。

そして個人的に最高なのが "Save RTF"。スタイルを適応した状態でリッチテキストで保存できる。Markdownって書慣れてる側としては書きやすいからREADMEだのなんだのに使いがちなんだけど、知らない人からするとやっぱりなんだかんだでリッチテキストの方が見やすいわけで。でも一度Markdownで書いたもののリッチテキスト版を別途作成するのも二度手間。そこでこの Save RTF、読ませる相手によってフォーマットを使い分け。もう、本当にこんな機能こそがほしかった。

あとはせっかくなんだからさらに脇役らしく立ち上がったときにDockにアイコンが出ないような設定ができるようになったら最高だなと思いつつ別にそこは使用には支障はない。これはコンパクトな良いソフトウェア。有料ソフトで350円するんだけど、350円くらい、喫茶店1回分だろう。いいじゃないそのくらい適正価格。

CotEditorのPHPシンタックス定義改良

現在は、ここで挙げた改良を含むPHP5.5まで対応したシンタックス定義をCotEditor用シンタックス定義のページで配布しています。

CotEditorのPHPシンタックスカラーリングは優秀で名高かったが、これでPHP5を書こうとするとさすがに古い。で、変数のカラーリングがなんか中途半端でもやもやするのでプロパティにも色が付くようにしてみた。

下記をPHPのシンタックス定義の「値」に足す。REにチェック。

(?<=->)\s*[a-zA-Z_\x7f-\xff][a-zA-Z0-9_\x7f-\xff]*+(?!\s*\()

プロパティと途中のインスタンスを抽出する正規表現

するとこれが

こうなる。

プロパティと変数がごっちゃになってる気もするけどまぁこんなもんだろう。これは単純に好みで::で渡すstaticなのは除外してる。

PHP5で加わった関数がどうとかclass内のアウトラインがどうとかあるけど、やると大変そうなので手は出さないでいる。時代はPHP5.3だぜよ。いやもう5.4なのか？最近は全然触ってない。

CotEditor コメントマクロ v1.1

CotEditorの一括コメントアウトスクリプトをアップデートしました。ついでに名前も変わって専用ページも作りました。

色々変わっているのでもし使っている方がいらしたら、入れ替えることをお勧めします。

変更点はこんな感じ。

ブロックコメントのコメント解除ができるようになりました（単独のブロックコメントのみ）

コメントが行頭でしか許されていない言語 (Apache, Shell Script) では、常に行頭に対してコメントアウト/解除をするようになりました

"ルーズセレクトモード" が選択できるようなりました
このモードを有効にすると、選択範囲の開始/終了が行の途中でもその行頭から行末までに対してコメントアウト/解除をします

行全体を選択する Select Lines と常にコメントアウト・解除を行う Comment Out, Uncommentを optional scripts/ として同梱しました

ブロックコメント切り替えの設定行数に関わらず、選択範囲内のラインコメント数が設定した割合を超えるときは、コメント解除を行うようになりました

コメントアウトの際、空行の行頭にもコメント記号をいれるようにしました

デフォルトのコメント解除への切り替えコメント割合を2/3に変更しました

対応している言語に R を含めていながら R の定義が入っていなかったので追加しました

何だか色々弄った結果ソースはかなり変わってます。AppleScriptはなかなか面白いのですがテキスト処理まわりは本当にアホの子なので色々工夫が必要でそれに行数を割かれている感じです。とはいえ速くなったか遅くなったかというと速くなってると思う。体感するほどではないと思いますが。

閑話休題。簡易ではありますがブロックコメントの解除ができるようになりました。ブロックコメントは開始と終了外すだけだから手動でもいいかな、と思っていましたが、実装してみたらとても便利だった。開始から終了までピッタリ選択しないと外れませんが、それもまた誤作動がなくていいかな、と思っておこう。

前述のとおりgistにチマチマ上げてた切れ端と合わせてCotEditorマクロ関係の専用ページを作りました。このコメントマクロはさらに隔離して1枚ページにしてあります。v1.1もここからダウンロードできます。

CotEditor用コメントマクロ

続きは新機能の解説みたいの。

世で配布されているCotEditor用のスクリプト・プラグインをまとめてみた。

私がまとめるまでもなく、踊るサボテン工房さんがCotEditor関連の情報は集めて下さっているのですが、スクリプトの機能で一発で探せるリストはなかったので便利かなと思い作ってみました（どっかで見たような文章）。

ググって淡々とリストアップしているだけなので実際に動作するかまでは確認していません。機能としても重複しているものもあるかと思います。順不同。使用方法・ライセンス・動作環境云々はそれぞれのサイトの記載に従ってください。なお、リスト内の作者名は識別用に併記させていただいており、簡略化のため敬称略となっております。

CotEditor 多言語一括コメントアウトScript

改良版のv1.1がリリースされています。専用ページを作りましたのでそちらからダウンロードしてください。

以前から自分用にチマチマ使っていたCotEditor用スクリプトにある程度汎用性を持たせたので公開しようと思います。

めずらしくスクリプト。しかもAppleScript、超珍しい。

機能としてはタイトル通り、選択範囲をコメントアウトするスクリプトで、ショートカットキーを用いて、複数文字から成るコメント記号を手軽に入力したり、複数行を一気にコメントアウトすることを目的としています。

スクリプトメニューからCommentスクリプトを実行 — スクリプトメニューに登録して使用

最近CotEditorのことばっか書いていますが、せっかくなので気が回るうちに書いておく。

CotEditorのデフォルトPerlシンタックスの改良案です。@Tachy_Pochy (a.k.a. 踊るサボテン工房)さんが書かれたPerl の定義を改良するをベースに置きつつ、さらに追加と改変を加える。まねすると幸せになるかもしれない。

CotEditorの1.3.1がリリースされましたね（cf. CotEditor 1.3.1 をリリースしました）。Lion発売後の初リリースになる今回はフルスクリーンに対応したり検索パネルの挙動が改善されたりと、小振りですが着実な進化を遂げていると思います。こうやって現在でも定期的にアップデートが行われるのは喜ばしい限りです。

1.2から自動更新が組み込まれましたが、上手く動いていなかったようで1.3.1でfixされています。なので今回のアップデートは手動で行う必要があります。Lion版とそれ以前のバージョン向けで別にリリースされているので、自分のOSに合わせたパッケージをダウンロードしましょう。

さて、それに伴って、というわけでは全然ないのですが、先日から追加シンタックス定義をまたいくつか連続して公開しましたので改めてBlogでも紹介しておこうと思います。