Skip to content

1024jp/svg-coteditor

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

21 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

SVG Suite for CotEditor

SVG編集のためのCotEditor用のスクリプトセットです。

SVGの カラーリング定義ファイルsvgz形式への書き出し 、W3Cでの バリテーション 、base64エンコードをした 画像の挿入テンプレートプレビュー など CotEditorでSVGを編集する際にたいへん便利なスクリプトが詰まっています。

CotEditorをSVGエディタとして使う、そんなクリエティブ・ライフを応援するスクリプト・スイートです。

スクリーンショット

内容物

  • hallo.svg —— お試し用のSVGデータ
  • README.md —— 説明書(この書類)
  • screenshot.png —— スクリーンショット
  • SVG/ —— スクリプトセット
  • legacy previwer/ —— SVG Suite v0.6までで使われていた、SVGをSafariでプレビューするスクリプト(詳しくは中のREADMEを参照)

インストール

インストール

SVG/ (スクリプトセット)

CotEditorのスクリプトメニューから「スクリプトフォルダを開く」を選択するとFinderでScriptMenuフォルダが開きます。 そのScriptMenuにSVGフォルダをまるごと移動させた後「スクリプトメニューを更新」を実行してください。 以降はスクリプトメニューから、もしくはお好みのキーアサインを割り当ててご利用ください。

Gapplin (SVGプレビューア)

Mac App Store から別途インストールして下さい。

アンインストール

ScriptMenuからSVGフォルダを取り除いてください。

使い方・各機能説明

基本的にはCotEditorでSVGを編集しながらGapplinで随時変更を確認する、という使い方を想定しています。そのままSVGZ形式に出力できるためInkscapeやIllustratorが出力したSVGファイルの最後のクリーンナップにも最適です。

Gapplinについて

本スクリプト・スイートではSVGのプレビューにSVGビューア Gapplinを用いています。このアプリケーションはSVGをWebKitレンダリングで表示する専用のプレビューアとして、本スイートと同じ作者によって開発されました。現時点でいまだSVG(Z)を開けないPreview.appに代わって、編集中のSVG画像のプレビューをサポートします。

GappinはそもそもテキストエディタでのSVG編集と併用することを目的に開発されており、CotEditorでファイルを保存すれば、自動的にビューも更新されるように設計されています。

New Document

既にテンプレートが挿入されている新しいSVGドキュメントを開きます。

Preview

編集中のSVGファイルをGapplinで開きます。 Command + Shift + R がショートカットキーとして割り振られています。

カラーリング・シンタックスがSVGのときのみ有効です(変更可)。

Validate on W3C

W3C Markup Validation Serviceを用いて編集中のファイルをバリデート(検証)し結果をダイアログで返します。 さらに Show Details で詳細結果をウェブブラウザで表示します。

インターネットに接続している必要があります。

このスクリプトはHTMLなどのSVG以外のファイルにも使えます(CSS検証サービスはカバーしていません)。

Export to/

編集中のSVGファイルを別のフォーマットで書き出します。

Open in Inkscape

編集中のSVGファイルをInkscapeで開きます。

Open in Firefox / Chrome

編集中のファイルをそれぞれFirefox, Chromeで開きます。

このスクリプトはHTMLなどのSVG以外のファイルにも使えます。

Embed Image...

任意の画像ファイルをbase64エンコードし、imageタグとしてキャレット位置に挿入します。

Templates/

それぞれ便利な定型句のテンプレートを挿入します。

Toggle Dark Mode

Gapplinで最前面のウインドウのダークモードを切り替えます。

カスタマイズ

いくつかのスクリプトではファイル内の値を書き換えることで挙動のカスタマイズが可能です。

###スクリプト全般

ショートカットキー

CotEditorスクリプトのショートカットキーはファイル名を変更することで設定可能です。 デフォルトではPreviewにのみ Command + Shift + R がショートカットキーとして割り振られています。 詳しくはCotEditor本体のヘルプを参照してください。

スクリプト名

スクリプトのファイル名を変更することでスクリプトメニューでの表記を変えることができます。 現時点では ファイルに依存関係はないので、お好みでわかりやすい名前に書き換えてください。

いらないスクリプトを削除したりディレクトリを移動させる(例えばValidate on W3C を ScriptMenuの最上階層に)のも問題ないです。

Previewで設定可能な値

  • syntaxName デフォルト値:SVG

    誤作動防止のためカラーリング・シンタックスがこの値のモードのときのみ実行されます。 "XML"等、他のシンタックス・モードでSVGを編集している場合は書き換えてください。

  • adjustsWindowPosition デフォルト値:true (位置を調節する)

    Gapplinで開いたウインドウがCotEditorで開いているウインドウの隣に来るように調節をするかを決定します。

New Document で設定可能な値

  • insertTitleTag,insertStyleTag,insertDefsTag

    それぞれタグをテンプレートとして新規書類に挿入するかを決定します。

  • syntaxName

    書類を作成した際に自動的にセットするカラーリングモードを設定します。

  • width,height

    SVGドキュメントのサイズを決定します。

Validate on W3C, Open in..., Export to... で設定可能な値

  • showAlertDialog デフォルト値:true (アラートを出す)

    セーブをせずに実行した際やファイルがSVGでなかった際に実行できない旨を知らせるアラートを表示するかを決定します。 falseにした場合は、何も表示せずにスクリプトを中断します。

Embed Image... で設定可能な値

  • maxFileSize

    容量の大きな画像を埋め込もうしたときの確認ダイアログを出すしきい値を変更できます。

ロードマップ

やりたいなと思ってること。気が向いたものから実装されます。されないかもしれません。

  • 英語版README
  • テンプレートをもう少し増やす
  • アラートをもう少し推敲する
  • バリテーション詳細結果の出力先としてCotEdiorのスクリプトエラーウィンドウを選べるようにする
  • ダイアログ等の日本語ローカライズ

開発環境

  • OS X Maverics 10.10
  • CotEditor 2.0.2

作者

1024jp

フィードバック

不具合や要望などありましたら、GitHub上や作者のTwitter等で気軽にご連絡下さい。 かならず対応することを保証はしませんが、前向きに検討させていただきます。 「便利に使ってるよ」というただの利用報告でもモチベーションが上がります(安いものです)。

また、Gapplinへのフィードバックがありましたら、BitBucket Issuesの方にお願いします。

ライセンス

本スクリプト・スイートは クリエイティブ・コモンズ 表示 - 非営利 3.0 非移植 ライセンス の下に提供されています。