Evernote for MacでMarkdownを利用できるようにするAppleScript。
Markdown文書からEvernoteのリッチテキストに変換したり、EvernoteのリッチテキストからMarkdown文書に変換したりといったことができる。
このように、Evernoteクライアント上で構造化されたデザイン文書を作成することが可能で、デザインは自分でカスタマイズできる。
cd ~/Library
mkdir Scripts
cd Scripts
git clone git://github.com/sandai/madever.git
or
https://github.com/sandai/madever/zipball/master
gitを利用していなければ上記のURLから普通にダウンロード。ダウンロードできたら解凍してできたディレクトリの名前をmadeverに変更して、
~/Library/Scripts
に配置。~/LibraryはOS X Lion以降であれば隠しフォルダになっていると思うので、こちらを参考にして見つける。
madeverディレクトリは~/Library/Scripts以下に置かなければ正しく動作しないので注意。
最終的に、~/Library/Scripts/madeverのようなディレクトリ構造になっていれば問題ない。なお、~/Library/Scriptsディレクトリが存在しなければ自分で作成する。
madeverではmarkdownやリッチテキストの変換処理をPandocというコンバータを利用してるので、それを別途インストールする必要がある。その方法を以下に2つ挙げる。
% brew install haskell-platform
% cabal update
% cabal install pandoc
次に.zshrcにパスを通す。(madeverはパスが通っていなくても問題はない)
PATH=$HOME/.cabal/bin:$PATH
http://code.google.com/p/pandoc/downloads/list
Hombrewなどパッケージ管理システムを利用していなければインストーラを利用すると良い。
madever側のスクリプトでは~/.cabal/bin/pandocと/usr/local/bin/pandocのpandocは自動で利用できるようにしているが、それ以外のパスであれば対応できていない。
その場合は自分でパスを設定する必要がある。madever/madever.scptをAppleScriptエディタで開いて、
任意のパスを記述してほしい。
Evernoteでmarkdownやリッチテキストを変換するにはmadeverディレクトリにあるmadever/madever.scptを実行する。実行方法はいくつかあるが最も基本的だと思われる方法を以下に3挙げる。
個人的には3つ目のSparkを推奨する。
AppleScriptエディタ.appを開いて環境設定画面のチェックを画像のように入れる。
するとメニューバーにスクリプトのアイコンが表示されるのでそこからmadeverが実行できる。
Alfredはランチャーアプリ。appstoreからインストールできる。インストールしたらメニュバーの「Preferences…」を次のように設定する。
あとはホットキーを押して下の画像のように呼び出すと実行できる。
Alfredはspotlightのインデックスを利用している。よって、~/Libraryがspotlightの対象外であればサーチにひっかからず呼び出せない。この現象はOS X Lionで確認済みだが以前のバージョンでも同じかもしれない。
その場合ホームディレクトリなどspotlightの対象に該当する適当な場所にmadeverディレクトリを置いて、シンボリックリンクを~/Library/Scripts/madeverに張るようにすれば良い。
ln -s ~/madever ~/Library/Scripts/madever
Sparkはホットキーアプリ。これを利用すればショートカットでスクリプトを実行することが可能となるので、スクリプトを意識せずにネイティブな機能のように変換することができる。個人的にはこの方法を推奨する。
- 導入の参考ページ
ショートカットを⌘Rに設定してmadever.scptを選択すれば、Evernote上で ⌘Rを押すと実行できるようになる。
OS X Lion以降であれば下の画像のようにLibraryディレクトリがSparkで表示されていないかもしれない。
その場合は、こちらの方法でまずFinderでLibraryディレクトリを表示して、ScriptsディレクトリをDrag&DropでSparkのウィンドウに持っていけばmadeverディレクトリが表示される。
上記のいずれかの方法でmadever.scptを実行すると、下の画像のように文書をmarkdownにするかhtml(リッチテキスト)にするかダイアログが表示されるので、どちらかを選択すればあとは自動で全て行われる。
madeverでは自分で文書のデザインをCSSによって作成することができる。作成したはテーマはmadever/themes以下にテキスト形式で保存し、loadteheme.scptを編集することで利用できるようになる。
madever/themes/template.txtをコピーして名前を変更し適当なエディタで編集する。
事前に利用できるセレクタは限られているので、テンプレートの通りにセレクタを利用しプロパティを設定して欲しい。
基本的にはCSSと代わりないが独自の形式で記述する。形としては次のような形式となるが、よくわからなければ他のテーマの記述を参考にすると良い。
body
property 1
property 2
h1
property 1
property 2
property 3
-- コメントは行頭で--を使うことで利用できる
h2
property 1
property 2
property 3
property 4
上記のような形で記述する必要がある。
- あらかじめきめられたセレクタだけを利用する
- セレクタの上は1行だけ開ける
- プロパティ同士は離さない
これらのことを守れば問題はない。
作成したテーマはmadever/themes以下に保存する。ファイル形式は他のテーマでも.txtになっているがテキストファイルとして扱えるなら何でも構わない。
テーマを変更するにはmadever/loadtheme.scptをAppleScriptエディタでを開きproperty filename: ""に変更したいテーマのファイル名を指定して保存すれば変更される。
テーマを作成した後はmadever/test/test.mdのテキストをEvernoteにコピーして試してみると良い。
madeverで利用できるMarkdown記法は基本的に通常の記法と違いはないが、Pandocに依存しているためいくつか異なる部分があること、そして、画像の扱いはMarkdown記法を使う必要がない部分で異なる。
コンバータのPandocに依存しているため通常のMarkdown記法とはいくつか異なる部分がある。
http://johnmacfarlane.net/pandoc/README.html#compact-and-loose-lists
たとえば、
- list 1
- list 2
- list 2 - 1
- list 2 - 2
- list 2 - 2 - 1
- list 2 - 2 - 2
- list 2 - 3
- list 2 - 4
- list 3
- list 4
のように書いてリッチテキストに変換したあと、再度markdownに変換したときに、
- list 1
- list 2
- list 2 - 1
- list 2 - 2
- list 2 - 2 - 1
- list 2 - 2 - 2
- list 2 - 3
- list 2 - 4
- list 3
- list 4
このような形で変換される。
http://johnmacfarlane.net/pandoc/README.html#block-quotations
> 文章
>
> > ネストされた引用を扱うためには上に一行あけるようにする
少し通常と書き方が異なるので注意。詳しくは上記URL先を参照。
リッチテキストからmarkdownに戻したときにalign属性が無効となる。そもそもmarkdownで表を書くのはおすすめしないので、あまり問題はないと思われるが。
Markdown記法では画像を挿入する場合以下のように記述する。
madeverでもこの記述に対応しているが、Drag&Dropで挿入した画像でも問題なく扱えるようになっている。
以下の画像のようにmarkdownの文書でも画像はDrag&Dropして文書に挿入すれば、リッチテキストに変換してもそのまま表示されるようになっている。
- リストは空行ができること
- 引用のネストは通常と異なること
- 画像はMarkdown記法で挿入しなくても良いこと
これらのことがわかれば基本的に問題ない。
- 08/10/2012
- pandocが~/.cabal/bin以下にない場合に動作が止まるバグを修正
- 21/07/2012
- themeにコメントをつけられるようにした
- 行頭で--から始まる行をコメントとして処理する
- themeにコメントをつけられるようにした
- 28/06/2012
- html(リッチテキスト)のときのimgにcssが適用できていなかったので修正
- どうやらEvernote側の仕様でimgタグのスタイル属性は排除されるらしいので、divで囲って適用させた
- html(リッチテキスト)のときのimgにcssが適用できていなかったので修正
- 25/06/2012
- htmlからmarkdownにしたときに改行の表記をバックスラッシュからスペース2つに変更
- 既にテーマが適用されているノートで、別のテーマを設定してmarkdownに変換した場合に一部のcssが残ってしまうバグを修正
- 21/06/2012 公開
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent