エクステンション屋さんになれるまで_その0.1

はじめに

ここには、CEP(Common Extensibility Platform)とやらに手を染めていく経緯を書き綴っていきます。
ExtendScriptしか武器のない身で(大昔にポケコンBASICをかじった、数年前ActionScript3を少しかじった、Cを少しかじったけどカケラも覚えていない、HTML5+CSS3も同様)太刀打ちできるのか、いや全然太刀打ちできてないんですが。
誰の役にも立たなそうですが、何も作らないうちからあまりにもハマりどころが多かったので、恥晒しがてら記録を残していくことにします。後発の妨げにならぬよう、理解の固まった部分だけ書き記していく予定ですが、どこかしらおかしなところがあれば即座にツッコミ入れていただけると大いに助かります。


着手開始まで

DTP作業のかたわら、ちまちまとスクリプトを書いて、ちょっと便利そうなのができて「これは汎用性あるぞ」と思ったらScriptUIでパレットなど作ったりしてて。
このパレットをアクリケーション標準装備のパネル群とドッキングできたら、さぞかしよかろうなあと思い、いわゆるプラグインはどんなもんじゃろうとSDKを覗いてみましたが、さっぱりわからずそっと閉じ。
しばらくしてFlashベースのUIがGUI操作で簡単に作れるConiguratorが到来。Coniguratorによるパネル作成はたいした専門知識も必要なかったので大喜びでいくつか作りました。

が、敢えなくディスコンに。CC2015からはビタイチ使えなくなりました。Flashここまで追い込まれるほど憎まれてるの…
同時にConiguratorから生成したzxpファイルをインストールするためのExtensionManagerも終わりました。以後はAdobe Add-ons上でやれ、という事らしいです。
で、いよいよ、CEPおやりなさい、と天啓が。


いざ着手(環境整備)

なんでもかんでもわかっている人にとってはテキストエディタひとつで作れる物…らしいのですが。
ExtendScript以外まるでわからないのでそういうわけには行きませぬ。
「Adobe CEP Extension」などでweb検索してみたとして、いろんなページに当たるわけですが、
人によりほぼ情報がバラバラです。とくに2015年以前の記事は混乱を招くので関わらぬが吉、と出ました。
いずれにしても、足元がおぼつくまでは、あっちこっち全部を参考にしていたらきっとわけがわからなくなることうけあい。
ウチの場合は幸いにしてten先生に手ほどきを乞うことができました。以後、全ての罠に律儀に嵌りながら進む無様っぷりの記録というわけです。
この記録は誰かのお役に立てば、という意識はほとんどなく、自分が同じ轍を踏まないように時折振り返るために書き留めておこう、というやつです。道のりが遠い。
つとめて自己の無知っぷり・できないっぷりを露見しつつになるのがとても痛いんだけど、まあがまん。
でもまあほら、つまづいたぶんだけ理解が深まる気もするし。。それにしてもつまづきすぎているのだが。

経典1:
CEP EXTENSION PRIMER 1 – SETTING UP TOOLS

ten先生によるお導きページ。文中のリンクも含め何度か(何度も)読み返すことになる経典。
書かれている通りにやれば一歩は踏み出せるようになっている。
…らしいのだが。はずだったのだが。

まあ、上記リンクの内容に沿って環境をこしらえます。
まずはBracketsのインストール。
今回の用途に向け非常に強力な、あのーアレである(言えよw)。
インストール後、起動します。アイコンは残念ながらブラでもケツでもありません。

機能拡張マネージャーから、先人がリリースされたエクステンションをどんどこインストールできます。

まあお好みで。ここではお薦めなど挙げませんが…

以下、必須項目。名称の一部を検索欄にどうぞ。紛らわしい名称の別物が出てくる場合もあるので注意。
Creative Cloud Extension Builder(CEP 7)
将来的にCEPバージョンは上がると思いますっていうか、コレ書いてる間に上がるっぽいです。CC2018出たし。
インストール後、ただちにメニューバーに項目「CC Extension Builder」が追加されます。

メニュー項目の詳細についてはのちほど。
※ウチはここから順調につまづき始めます


PlayerDebugModeの設定

次、経典に沿って、PlayerDebugModeの設定。詳しくは経典の後半を参照してください。

~/Library/Preferences/com.adobe.CSXS.<当該バージョンNo.>.plist
に追記せよ、とあります。


つまづき:
ユーザ>ライブラリ ではなく起動ディスク>ライブラリを見に行きました。


そっからかよ、と言われそうですが、まあ、そっからです。。
いざ書類は見つけたんですが
“「PlayerDebugMode」というエントリを追加して値を1(String)に設定”
がおぼつかず、ターミナルコマンドを授かりました。

defaults write com.adobe.CSXS.5 PlayerDebugMode 1

とくに説明ありませんでしたが(信頼されている)、
<コンピュータ名>:~ <ユーザ名>$ からではファイルパスが通らないのでcdコマンドが必要です。
cd (←半角スペースつける)
まで打って、ユーザ>ライブラリ>Preferencesフォルダを投げ込んでreturnします。
カレントディレクトリを移動、というやつです。
<コンピュータ名>:Preferences <ユーザ名>$ になったら授かりコマンドをペースト。
CC2017でテストするので、5を7に書き換え、

defaults write com.adobe.CSXS.7 PlayerDebugMode 1

とし、事なきを得ました。
経典1はここまで。まだ準備の半分です。。

経典2:
CEP EXTENSION PRIMER 2 BUILD UP PROJECTS 1

次の経典です。
この内容に沿って続けるとします。

新規Extensionの作成

Extensionプロジェクトの生成。さきほど増えたメニュー項目「CC Extension Builder」から「New Creative Cloud Extension」を実行。
ここでエクステンション名とユニークIDの入力がありますが、最初の最初だし、テストってことでHello Worldのまま進めます。

で、プロジェクトが作られるんですが、内容はというと「『Hello World! とアラートを出すためのボタンが1個あるだけのパネル」です。

ホストアプリケーションの指定

経典に沿って、Bracketsのウィンドウ左側から CSXS>manifest.xml を開き、最低限いじります。
最低限とは、ホストアプリケーションの指定。ウチはInDesignにしました。


つまづき:
CC2014以下では動きません


たまたま起動してたCS6を対象にしようとしてしまいました。けっこう恥ずかしい。
気を取り直して、InDesignCC2017をホストに指定します。
manifest.xml の <HostList> タグ内に見慣れたアプリケーション名が連なっているので、

<!– Photoshop –>

の下2行ぶんをコメントアウトします。前後の行にならって “<!—“と “–>”で括ります。
続いて、コメントアウトされているInDesignのホスト名をコメント解除します。


つまづき:
末尾のスラッシュ “/“は削除しちゃだめ


なんだかとても疲れていたので、”/>”がエスケープされていると錯覚したらしいです。すごく恥ずかしい。

次に、その行のバージョン指定を変更します。
既存の”[10.0,10.9]” はCC2014を指しています。CC2017で動かすために”[12.0,12.9]”としました。

manifest.xml はここまで。保存します。
経典のほうはその他の要素について解説が続きますが、今回は最低限をやるので割愛。

経典3:
BRACKETS用エクステンション、リリースしました(^-^)/

ここで、ten先生謹製のBracketsエクステンションを頂戴します。

packagetoolのインストール

Bracketsの拡張機能マネージャー(前述です)を開き、ウィンドウ下部の「URLからインストール」から、ten先生謹製「packagetool」をインストールします。
直リンも行儀がわるいので、経典3のほうでURLをコピーしてきてくださいまし。本文中の最初のリンクのやつです。
インストールするとメニューバー項目「Package Current Project」が追加されます。


ZXPSignCmdのインストール

次に経典でいうところの「肝心のツール」をダウンロードします。

CEP-Resources > ZXPSignCMD > 4.0.7 > osx10 > ZXPSignCmd.dmg まで掘り下げていくとダウンロードボタンあります。
とりゃえずCC2017で試すだけなので最新のをもらってきましたが
頂いて展開したZXPSignCMDフォルダは、どこか適当なところに置いておきます。オデコの上とかそういうのはだめです。


つまづき:
当該ファイルだけダウンロードするのがおぼつかず、CEP-Resources全体をダウンロードしちまいました。重かった。


そしたらメニュー「Package Current Project」から「Packager Preferences」を実行。
設定画面が出ます。

上の項目で、さっきもらってきたZXPSignCMDファイルを指定。
下の項目にタイムスタンプサーバのURLを入れます。どれを使うかはごじぶんで決めてください。何も言えない。

.p12ファイルの用意

準備があとひとつあります。.p12ファイルの用意です。ウチは既に持っていました。


つまづき:
Configuratorで作成したp12ファイルはだめ


Adobeつながりでも流用不可でした。。認証サーバが店じまいしている。
ten先生に相談したところ、「AdobeExchangePackagerを使えばいいかも」とのことで。
なんかわからないまま、p12ファイルを作るだけのために以下のアプリをダウンロード。
https://www.adobeexchange.com/api/Packager.dmg
インストール&起動して、右上の「Certificate and Settings」をカチ。

「Create Certificate..」ボタンからp12ファイルを作成できます。
作成時に設定したパスワードはパッケージ時に必要になるので忘れないように。
どこか適当なところに置いておきます。オデコの上とかそういうのはだめです。


(やっと)エクステンション作成

えー、いよいよのエクステンション作成。
メニュー「Package Current Project」から「Package Current Project」を実行。

3つの項目を埋めます。
1番目でp12ファイルを指定
2番目で書き出し先を指定
3番目でp12ファイルのパスワードを入力。
書き出しに成功すればその旨ゆってきます。

ちなみに書き出し失敗した時のエラーがこちら。エラーコード26はp12ファイルが不正。

というわけでzxpファイルが生成できました。やれやれ。
しかしこれで終わりではないのです。。


野良zxpや自分テスト用zxpファイルのインストールにはZXPInstallerを使わせてもらいます。
http://zxpinstaller.com
これをダウンロードして起動します

このウィンドウにzxpファイルを投げ込むとインストールが始まり…
ませんでした。

よくわからなくなったので新規のHelloWorldを作成。今度こそうまくいき…
ませんでした。

これは前述のマニフェストのスラッシュ削除によるもの。……ぜぇぜぇ。

…という感じで、やっとインストール成功。


ten先生の寸評:
「ドーテーの初体験見ているようだったw」


おわりに

毎日の昼休みでだけさわってたんですが、
この一歩を踏み出すのに2週間以上かかった勘定になります。おつかれさま。。
さてー、いよいよなんか作ってみるとしますっ。
わりと先が思いやられます。

今から始める人たちが、ここまでをつまづかずにやれるたら何よりです(などといった心配はたぶん無用で、まわりの人たちはさくさく進んでおられるようす…)。

Facebooktwittergoogle_plus

InDesign:文字スタイルを重ねたい時あるじゃんすか

というわけで、昨年末の転職以後、もくもくもくもくと組版ばっかりやってます。
それ自体は飽きがちなんだけど(一人前になってない分際で何言うか)、合間合間のスクリプチングや小技の発見でモチベを維持していくショゾンです。

で、文字スタイルを重ねがけしたい時ってあるじゃんすか。ありませんか。そうですか。

でも2つ同時にはかけられないじゃんすか。
でも、そんなんで「下付き+ボールド」とか「下線+イタリック」とか文字スタイル増やしたくない。死んでもやだ(とまでは言わん)

そこで、正規表現スタイルに仕込みを入れるじゃんすか。

おー、やったー。

たまーにかからない時がありますが、てきとうに文字を入れたり消したりしてるうちにかかります(危険w)

いまでも先頭文字スタイルをどっぷり愛用されている場合は使えませんのであしからず。。

あとあと「先頭文字スタイルの終了文字」を挟むつごうで検索や索引作成の妨げになる事だけは留意しておいたほうが。ウチはそれでもやりたい派。
※あとで電子化する人達が苦労するそーです スーマセンスーマセンw

え? スクリプト? ないよ? 何で?
Facebooktwittergoogle_plus

InDesign:タブ位置ぜんぶずらすやつ

…みたいな、タブ送りまくりのページで、しかもパターンが多様すぎてタブ位置が段落スタイルで管理しきれなくて「もうこれきり触りたくない」「できれば直さず済ませたい」とか思ってたところに、以下のようなヒドい思いつきを突っ込まれまして

イラスターなら問題文の段落の左インデントをマイナス入れるだけで解決するんだけど。

InDesignだと、タブ位置をぜんぶ1こ1こつまんでずらさないといけない。数値入力すると、距離によっては移動じゃなく新規追加されてしまう。
ぎゃー。

という局面に追い込まれてスクリプト書きました。4〜5分w


id_tabStopShifter.jsx

CS6で使用しました。
たぶんどのバージョンでも動く気がします。


カチカチすると、きかれます。
数値を入れます。単位はタブルーラーに準じること。

おおー、やったー

ニッチすぎるorz
でも、たぶんいつか誰かの役に立つはず…
その時は、ご自分の背負わされた作業の不毛さに嘆くのをお忘れなく。
こんなことやらされて、涼しい顔してちゃダメです。おのれー。

Facebooktwittergoogle_plus

Illustrator:アートボードを「フィッ」とするやつ

ひさびさのイラスター案件ですけども。
ここんとこは図版は専任がいるので自分では微調整ていどしかあまり用がなくて。
でもまあ、アートボードの整備がされてなかったりするですよ。

で、アートボードサイズをオブジェクト(群)に合わせる機能が元からついてますけど。
四辺とも動いてしまうのが都合よくない、という局面がなかなか少なくない。
ので、スクリプト書きました。

アートボード調整じたいは前に自分でもやったことあるんですが、つい予告的にTwitterでぼやいてしまい、
あるふぁさんが140字以内で書いてくださいました(いつもすみませんw)。
あとあれだ、メニューコマンドをいくつか使いたかったのでtenさんのところをがっつり参照しました。いつも助かってます。実際のところココに書かれてないコマンドを使ったんだけど、まあ実際助かりましたw

とりゃえず手間のない範囲でいくつか機能を増やしてscriptUIつけてみました、ということで


ai_artboard_fitter.jsx

MacOSX Yosemite IllustratorCS6とCC2017で動作確認
CS4以降で動く予感がしますが。
ダメならいいとこで落ちると思うので、実行前はなんとなくドキュメントを保存しておいてください。


あそびかた

ダイアログ外観こんなかんじ。

各コントロールとくに説明は必要なかろうかと思います。
だったら見てすぐわかる名前つけろよって話ですけども。
あのーPanasonic製のリモコンとか、そうですよね。「再生」とか「巻き戻し」とか大きく書いてあるよね。。
ま、いいや

プリーズボタンを押すと、アクティブなアートボード
チェックを入れた辺だけがオブジェクトにフィットします。


「アクティブなアートボード」について

説明が必要か微妙ですが、いちおう。
アートボードパネル上でハイライトされているのがアクティブなアートボードです。
アートボードツールでドキュメントウィンドウ上で直接さわって切り替えることもできます。
アートボードツールを持ったとき、点線で囲まれているのがアクティブなアートボードです。


「オブジェクト全体」について

説明が絶対必要だと思うんですが、

アートボードオプションの標準機能「オブジェクト全体に合わせる」は、「隠す」されたオブジェクトを無視します。

でも非表示レイヤー中のオブジェクトは無視されません。
サブレイヤーはというと、これもレイヤーと同様、無視されません。
この意味のわからん仕様を踏襲するためにムダに苦労するハメに。。

とにかく、仕様としては自分の用途にそぐわない&まったくもって気にくわないので、
隠すだろうがレイヤー丸ごとだろうが、当スクリプトの初期値では非表示オブジェクトはすべて無視するように設定してございます
標準機能通りの仕様で使いたい場合はチェックボックス「include〜」をオンにしてくださいまし。

※図版の色味が全体にくすんくすんしているのは、スクショをCMYKドキュメントに配置してしまったせいですorz

Facebooktwittergoogle_plus