Add an image to a frame using JavaScript

[fraktall]

I can't find a way to programmatiaclly add an image to a frame placed with "Frame Tool" in the document.
This is the Frame layer in Photoshop.

Some verification code and output:

$.writeln(frameLayer.typename); // === "LayerSet"
$.writeln(frameLayer.name); // === "placeholder_frame"
$.writeln(frameLayer.artLayers.length); // === 0
$.writeln(frameLayer.layers.length); // === 0
$.writeln(frameLayer.layerSets.length); // === 0

I assume that's ok, but there's no `add` method or anything like that. Object content from vscode debug console:

How can an I add an image to this layer?

[Stephen_A_Marsh]

A couple of different methods that come to mind:

• Copy/paste content into active frame
• Place linked or embedded into active frame

Or the opposite of what you currently have:

• Existing layer active, then add the frame

Obvioulsy drag-n-drop is not for scripting. More here:

https://helpx.adobe.com/photoshop/using/place-image-frame-tool.html

[fraktall]

Thanks, though not sure I'm following. The frame layer is active but there's no method that'd would allow adding an image to it. I thought about doing something like that:

const imageFile = new File("/path/to/file.jpg");
frameLayer.artLayers.add(imageFile);

Obviously this is not working...

[Stephen_A_Marsh]

Did you try:

• Copy/paste content into active frame layer?
• Place linked or place embedded into active frame layer?

[fraktall]

I'm more than happy to try, do you know if there's a programmatic way of doing both!

Also what "linked" and "embedded" is referred to in this context?

[Stephen_A_Marsh]

---

@fraktall wrote:

I'm more than happy to try, do you know if there's a programmatic way of doing both!

---

I feel that this discussion is lacking context for the source that should be masked via the frame... What is the source image?

• A layer in the current doc?
• A different open doc?
• An unopened doc on disk?

What is your particular use case? Where is the source data that you wish to mask via a frame?

Should I use your example of:

const imageFile = new File("/path/to/file.jpg");

---

Also what "linked" and "embedded" is referred to in this context?

---

A place image, as in File > Place Linked or File > Place Embedded (as mentioned in the previous link to using frames).

[fraktall]

My use case:

- a psd file with a mockup

- frame in the middle to contain an image

- script opens the psd doc

- script locates a jpg file in the file system

- script should add that image to the frame (just because the image can be placed nicely, without the need to adjust size if I were to use a smart object layer instead)

no masking involved

[Stephen_A_Marsh · Accepted solution]

Many things are not covered under the standard JavaScript object model reference, one has to use action manager code. The easiest way to do this is to use the scripting listener plugin and or the clean sl script on the recorded code, however some folk understand how to write it from scratch without this crutch.

Presuming that your existing code is set to open the targetFile.psd and to select the targetLayer that contains the frame:

placeEvent(5, new File( "~/Desktop/sourceFile.jpg" ), true, 0, 0);

function placeEvent(ID, null2, linked, horizontal, vertical) {
	var s2t = function (s) {
		return app.stringIDToTypeID(s);
	};
	var descriptor = new ActionDescriptor();
	var descriptor2 = new ActionDescriptor();
	descriptor.putInteger( s2t( "ID" ), ID );
	descriptor.putPath( s2t( "null" ), null2 );
	descriptor.putBoolean( s2t( "linked" ), linked ); // change true to false to embedd
	descriptor.putEnumerated( s2t( "freeTransformCenterState" ), s2t( "quadCenterState" ), s2t( "QCSAverage" ));
	descriptor2.putUnitDouble( s2t( "horizontal" ), s2t( "pixelsUnit" ), horizontal );
	descriptor2.putUnitDouble( s2t( "vertical" ), s2t( "pixelsUnit" ), vertical );
	descriptor.putObject( s2t( "offset" ), s2t( "offset" ), descriptor2 );
	executeAction(s2t( "placeEvent" ), descriptor, DialogModes.NO);
}

The above code presumes a file titled sourceFile.jpg on the desktop.

[fraktall]

Thanks! I'm sure this is a step in the right direction, though it's placing the file above the frame when I run the script.

I set `doc.activeLayer` to the `placeholder_frame` layer.

[Stephen_A_Marsh]

When I tested without scripting, I was able to copy/paste into the frame. When I tried with scripting, it pasted above the frame.

The script listener code provided was a slightly modified "recording" of placing the file directly into the frame, it obviously worked for me at the time otherwise I wouldn't have poste it... I'm not sure why it isn't working for you. Perhaps you should install scripting listener and try yourself. Good luck!

[contactzero]

I've got some framing programmed, sometimes it performes correctly, sometimes not.

Here is what I found after some testing....

Setup ;

50 cm x 50 cm image.

Turn on grids at 33%, subdivisions 1.

Select the frame tool and draw INSIDE any 3x3 division (11%) and a NEW frame group layer is created on top of the image.

Select the frame tool and select or draw more than a 3x3 division (11%) and the frame group is created in the SAME layer as the image without creating a new layer on top.

Programmatically - this sucks.

What's worse is that if your image is a smart object and you resize your image down 50%, no selection by the frame tool will create a frame on the image... A new layer with the frame group will ALWAYS be created.