【JSX】ScriptingListenerで記録したコードを整理しよう

 今回はPhotoShopの自動化するときに便利な、ScriptingListenerの話です。

 自動化するときにはすごく重宝するのですが、いかんせんそのままコピーして使うにはコードが見にくい😓
 そこでコードをわかりやすく整理して、より理解しやすくしていきたいと思います。

準備:コードを記録する

 まずはコードを記録しないと始まらないので、ひとつコードを記録します。
 今回はべた塗レイヤーを作成します。
 出来上がったコードがこちら。

var idMk = charIDToTypeID( "Mk  " );
    var desc218 = new ActionDescriptor();
    var idnull = charIDToTypeID( "null" );
        var ref1 = new ActionReference();
        var idcontentLayer = stringIDToTypeID( "contentLayer" );
        ref1.putClass( idcontentLayer );
    desc218.putReference( idnull, ref1 );
    var idUsng = charIDToTypeID( "Usng" );
        var desc219 = new ActionDescriptor();
        var idType = charIDToTypeID( "Type" );
            var desc220 = new ActionDescriptor();
            var idClr = charIDToTypeID( "Clr " );
                var desc221 = new ActionDescriptor();
                var idRd = charIDToTypeID( "Rd  " );
                desc221.putDouble( idRd, 255.000000 );
                var idGrn = charIDToTypeID( "Grn " );
                desc221.putDouble( idGrn, 0.003891 );
                var idBl = charIDToTypeID( "Bl  " );
                desc221.putDouble( idBl, 0.003891 );
            var idRGBC = charIDToTypeID( "RGBC" );
            desc220.putObject( idClr, idRGBC, desc221 );
        var idsolidColorLayer = stringIDToTypeID( "solidColorLayer" );
        desc219.putObject( idType, idsolidColorLayer, desc220 );
    var idcontentLayer = stringIDToTypeID( "contentLayer" );
    desc218.putObject( idUsng, idcontentLayer, desc219 );
executeAction( idMk, desc218, DialogModes.NO );

 べた塗レイヤーを作成しているところを抜き出すとこんな感じ。

14行から19行あたりにカラーっぽいものがあるし、なんとなくここだってわかるね

 必要な部分を抜き出せたら、さっそく整理をしていきます😄

コードを整理する

IDを整理する

 まず、このコードが見にくい一つの原因が、idと名のついている変数です。
 たとえば・・・

                var idRd = charIDToTypeID( "Rd  " );
                desc221.putDouble( idRd, 255.000000 );

 この部分ですが、idRdにcharIDToTypeID( “Rd ” )を代入していますが、これはちょっと見にくいです。
 どうしても変数を使わなければいけないところではないので、さくっと一行にまとめます。

desc221.putDouble( charIDToTypeID( "Rd  " ), 255.000000 );

 これで1行減りました😆
 こんな感じで、idと書いてある変数を、次々に置き換えていきます⭐

間違えると動かなくなっちゃうから、慎重にね

 全部置き換えるとこんな感じになります

var desc218 = new ActionDescriptor();
var ref1 = new ActionReference();
ref1.putClass( stringIDToTypeID( "contentLayer" ) );
desc218.putReference( charIDToTypeID( "null" ), ref1 );
var desc219 = new ActionDescriptor();
var desc220 = new ActionDescriptor();
var desc221 = new ActionDescriptor();
desc221.putDouble( charIDToTypeID( "Rd  " ), 255.000000 );
desc221.putDouble( charIDToTypeID( "Grn " ), 0.003891 );
desc221.putDouble( charIDToTypeID( "Bl  " ), 0.003891 );
desc220.putObject( charIDToTypeID( "Clr " ), charIDToTypeID( "RGBC" ), desc221 );
desc219.putObject( charIDToTypeID( "Type" ), stringIDToTypeID( "solidColorLayer" ), desc220 );
desc218.putObject( charIDToTypeID( "Usng" ), stringIDToTypeID( "contentLayer" ), desc219 );
executeAction( charIDToTypeID( "Mk  " ), desc218, DialogModes.NO );

 行数が減り、だいぶすっきりしました😊
 しかしこれでもまだ何が何なのかよくわからない・・・なので、次のステップへ移ります。

並び変える

 まず見やすくする方法の一つとして、descとrefの宣言場所を変更します。
 例えば・・・

var desc218 = new ActionDescriptor();

 これが一行目にあります。
 そして注意すべきは「desc218」(番号は人によって違います)
 しかし実際にこれを使っているのがどこかと見ていくと、使っているのは4行目なんですね。

var desc218 = new ActionDescriptor();
var ref1 = new ActionReference();
ref1.putClass( stringIDToTypeID( "contentLayer" ) );
desc218.putReference( charIDToTypeID( "null" ), ref1 );

 これを見やすくするために、一行目にあったこれを3行目と4行目の間に持っていきます。

var ref1 = new ActionReference();
ref1.putClass( stringIDToTypeID( "contentLayer" ) );
var desc218 = new ActionDescriptor();
desc218.putReference( charIDToTypeID( "null" ), ref1 );

 こんな感じに、初めて使われているタイミングの直前に持っていきます。
 それをコード全体でやってみると、こんな感じになります。

var ref1 = new ActionReference();
ref1.putClass( stringIDToTypeID( "contentLayer" ) );
var desc218 = new ActionDescriptor();
desc218.putReference( charIDToTypeID( "null" ), ref1 );
var desc221 = new ActionDescriptor();
desc221.putDouble( charIDToTypeID( "Rd  " ), 255.000000 );
desc221.putDouble( charIDToTypeID( "Grn " ), 0.003891 );
desc221.putDouble( charIDToTypeID( "Bl  " ), 0.003891 );
var desc220 = new ActionDescriptor();
desc220.putObject( charIDToTypeID( "Clr " ), charIDToTypeID( "RGBC" ), desc221 );
var desc219 = new ActionDescriptor();
desc219.putObject( charIDToTypeID( "Type" ), stringIDToTypeID( "solidColorLayer" ), desc220 );
desc218.putObject( charIDToTypeID( "Usng" ), stringIDToTypeID( "contentLayer" ), desc219 );
executeAction( charIDToTypeID( "Mk  " ), desc218, DialogModes.NO );

 見やすくなったか?と思われるかもしれませんが、ここで同じdescを使っているところをひと固まりとして、間に改行を入れていきます。

var ref1 = new ActionReference();
ref1.putClass( stringIDToTypeID( "contentLayer" ) );

var desc218 = new ActionDescriptor();
desc218.putReference( charIDToTypeID( "null" ), ref1 );

var desc221 = new ActionDescriptor();
desc221.putDouble( charIDToTypeID( "Rd  " ), 255.000000 );
desc221.putDouble( charIDToTypeID( "Grn " ), 0.003891 );
desc221.putDouble( charIDToTypeID( "Bl  " ), 0.003891 );

var desc220 = new ActionDescriptor();
desc220.putObject( charIDToTypeID( "Clr " ), charIDToTypeID( "RGBC" ), desc221 );

var desc219 = new ActionDescriptor();
desc219.putObject( charIDToTypeID( "Type" ), stringIDToTypeID( "solidColorLayer" ), desc220 );

desc218.putObject( charIDToTypeID( "Usng" ), stringIDToTypeID( "contentLayer" ), desc219 );

executeAction( charIDToTypeID( "Mk  " ), desc218, DialogModes.NO );

 どうでしょうか? なんとなくですが、このコードが何をしているか、見えてくるんじゃないでしょうか😊

 さてこれで、コードの検証ができそうです。
 ブロック単位でざっくり検証してみたいと思います。

今回はこのまま進んじゃうけど、descの218や219もわかりやすく1からの通し番号を振ってもいいかも

コードのざっくり検証

var ref1 = new ActionReference();
ref1.putClass( stringIDToTypeID( "contentLayer" ) );

 「contentLayer、について話をするぜ!」って感じっぽいですね。
 ちなみにcontentLayerはべた塗りだけじゃなく、パターンやグラデーションもこれにあたるみたいです。
 パターンやグラデーションのコードを記録すると、同じくこれが登場します。

var desc218 = new ActionDescriptor();
desc218.putReference( charIDToTypeID( "null" ), ref1 );

 特にここに設定するものはありません、って感じかな?

var desc221 = new ActionDescriptor();
desc221.putDouble( charIDToTypeID( "Rd  " ), 255.000000 );
desc221.putDouble( charIDToTypeID( "Grn " ), 0.003891 );
desc221.putDouble( charIDToTypeID( "Bl  " ), 0.003891 );

 「色はこれです!」と言ってますね、わかります。

var desc220 = new ActionDescriptor();
desc220.putObject( charIDToTypeID( "Clr " ), charIDToTypeID( "RGBC" ), desc221 );

 「カラーはさっき話したやつでお願いします」ってことみたいですね。
 カラーを設定したdesc221を引っ張り出してきて、RGBC(=RGBColor)だよ、って言ってるみたいですし。

var desc219 = new ActionDescriptor();
desc219.putObject( charIDToTypeID( "Type" ), stringIDToTypeID( "solidColorLayer" ), desc220 );

 「タイプはsolidColorLayerだよ」と読めます。
 要するにべた塗りレイヤーだよと言ってるんですね。

desc218.putObject( charIDToTypeID( "Usng" ), stringIDToTypeID( "contentLayer" ), desc219 );

 再度「contentLayerの話ね」って感じ?

executeAction( charIDToTypeID( "Mk  " ), desc218, DialogModes.NO );

 「作れ!」ってことですね。MK(=make)ですしね。

おしまい

 実のところコードをコピペして使うだけなら、そこまで必要ないんですけどね😅
 ただ、多少のカスタマイズをしたいとか、元のコードのままだとどうも気持ち悪い・・・という場合に。

 けれど、時々あるのが整理をしていくと「あれ?これ何に使ってるの?」と思われるものが多々出てきて、実際にそこを削除しても正常に動く場合も多いです😓
 どうしても機械的に出力している関係だったり、昔の名残的なものもあるのかな~って感じです。

 何はともあれ、コードをざっくりとでも理解するのは大事なことだと思うので、ぜひ試してみてください😊

 べた塗りレイヤーに関しては、カラーの取得のサンプルコードも含めて以前記事にしたものがあります。
 よろしければこちらもあわせてどうぞ。

私(S.Fuka)が企画、シナリオ、グラフィックを担当させていただきました、にゃっほい屋のゲームがSteamにて配信中です。
もし興味がありましたらSteamページだけでもご覧になっていただければ幸いです。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です