Photoshopでインクリメントセーブ

こんにちは！Rhinoです。
寒くて手が動きませんね…

今日は先日思いついたPhotoshopのセーブ(保存)について書いてみたいと思います。
モバイルゲームを開発しているとPhotoshopでテクスチャを作成する機会が多いのですが、ある程度描いたら別名で保存して履歴を蓄積していく作業がやや手間に感じ、Mayaのインクリメントセーブのようなものが使えないかなあと考えて作ってみました。
素人プログラムですので参考程度に見て頂けたらと思います^^

PSDファイルを開いている状態で実行するとファイルが存在する階層にIncrementSaveフォルダを作成し、同ファイルに三桁の連番を付けて保存するようにしてみました。
さすがにファイル数が999を超えることはないと思うのですが…

JavaScriptをアクションを使ってショートカットで動かす方法も以前こちらに書いていますので宜しければ合わせてご覧ください。

#target photoshop
// Photoshopを最前面にする
app.bringToFront();

var doc = app.activeDocument;
const incrementSaveFolder = 'IncrementSave';

try{
    var fileFullName = doc.fullName;
    var filePath = doc.path.fullName;
    var targetFolder = new Folder(  filePath+ '/' + incrementSaveFolder );
    
    // インクリメントセーブのフォルダがなければ作成する
    if( ! targetFolder.exists ){
            targetFolder.create();
    }

    var psdFiles = targetFolder.getFiles( '*.psd' );
    // 桁揃え
    var pad = ( '000' + ( psdFiles.length + 1 ) ).slice( -3 );
    
    // ファイル名
    var fileName = fileFullName.name.match( /([^\/\\]+)\.(\w+)$/ )[1];
    // 拡張子
    var ext = fileFullName.name.match( /([^\/\\]+)\.(\w+)$/ )[2];
    var newFile = new File( targetFolder+'/'+fileName+'_'+pad+'.'+ext ); 

    // PSD形式
    var psdOpt= new PhotoshopSaveOptions();
    
    if( doc.channels.length > 3 ){
        // アルファチャンネル有効
        psdOpt.alphaChannels= true;
    }else{
        psdOpt.alphaChannels= false;       
    }

    // 複製を保存
    doc.saveAs( newFile, psdOpt, false, Extension.LOWERCASE );
    // 保存
    doc.saveAs( fileFullName, psdOpt, false, Extension.LOWERCASE );

 }catch( e ){
     alert( "PSDファイルを保存して下さい" );
 }

正規表現について

ファイル名や拡張子を取得する為に正規表現を用いました。
正規表現というのは文字列内で文字の組み合わせを照らし合わせるのにに用いられるパターンのことです。特定の文字列ではなくパターンで照合することで、色々な文字列に対応できるというわけですね。

この部分で使用しています。

// ファイル名
var fileName = fileFullName.name.match( /([^\/\\]+)\.(\w+)$/ )[1];
// 拡張子
var ext = fileFullName.name.match( /([^\/\\]+)\.(\w+)$/ )[2];

 /([^\/\\]+)\.(\w+)$/

の箇所です。
何やら訳のわからない暗号のようですね。
大丈夫！僕も勉強中ですｗ

正規表現を用いてどうやってファイル名を取得するか

例えば次のようなパスを示す文字列があるとします。

var path = 'D/file/test.psd';

今回欲しいのはこの文字列の中の次のような3つだとします。

ファイル名＋拡張子	test.psd
ファイル名	test
拡張子	psd

これらをmatchメソッドを使って検索していきます。
まずは括弧()でくくりキャプチャグループを使ってパターンの中の一部にマッチした文字列も併せて取得できるようにしました。
ここではPlayCodeを使ってテストしています。

console.log( path.match( /()()/ ) );

3つ文字列が返ってきてますね
配列の0番目には正規表現でマッチした文字列、1番目には1つ目のグループ化で取得した文字列、2番目には2つ目のグループ化で取得した文字列が入ります。

 ["","",""]

まずは拡張子のpsdの文字列を取得する為に2番目のグループ( 括弧()で括られた部分 )に記述していきます。

console.log( path.match( /()(\w+)$/ ) );

\w で任意の文字列にマッチするようにし、+で1 回以上の繰り返します。
$は入力の末尾にマッチします。
コンソールには次ような文字列が返ってきているのではないでしょうか？

["psd","","psd"]

.(ドット)も必要ですのでエスケープしてマッチさせます。

console.log( path.match( /()\.(\w+)$/ ) );

[".psd","","psd"]

次はファイル名のtestの部分が欲しいので、1つ目のグループに記述していきます。
その為にはtest.psdの直前の/(スラッシュ)または\(バックスラッシュ)から.(ドット)までを取得してあげれば良さそうですね。
[^]は文字集合の否定です。次に続く文字ではない文字にマッチします。
否定の文字を入れていませんので、全体が返ってきてますね。

console.log( path.match( /([^]+)\.(\w+)$/ ) );

["D/file/test.psd","D/file/test","psd"]

例えば先頭のDを否定してみましょう。

console.log( path.match( /([^D]+)\.(\w+)$/ ) );

D以外が返ってきていますね。

["/file/test.psd","/file/test","psd"]

そこで/(スラッシュ)と\(バックスラッシュ)を否定します。

console.log( path.match( /([^\/\\]+)\.(\w+)$/ ) );

最後の/(スラッシュ)または\(バックスラッシュ)で否定された部分で欲しい文字列が返ってきましたね。
あとはこの配列から好きな部分を取得してあげれば良いと思います。

["test.psd","test","psd"]

他にも良い方法があるかと思いますので色々と試してみて下さい。
では、また！