Load Document Image Into UXP Panel

I have more or less exhausted my knowledge on this one so I am asking some of you more experienced developers.

In my UXP panel, I have something like this which loads a static image from the Panels /images folder.

<img style="width: 70px; height: 98px;margin-right: 10px;" src="images/landscape.jpg"></img>

I was wondering if its possible to load the current document image instead of this static placeholder ?


No, it’s not possible as there’s currently no (easy) way of reading pixel data of layers / documents.
One trick I used in Icon Board was to convert the path data to SVGs which could then be rendered in the panel. This allowed me to have synchronized imagery between Photoshop and the panel, but such an approach does only work with shape layers of course.

When you save a PSD with the option “maximum compatibility” it does include a thumbnail somewhere in the file data, for other software to show a file preview (I think?).
Maybe… theoretically… one could extract that data and built an image from that, but honestly, I wouldn’t really know where to start.

Why not just save the current document as a jpg thumb to the panel folder and replace the src tag contents with innerhtml and the panel folder document jpg path?

Ah yes, this would be an option, too. Exporting can sometimes be slow though, so I wouldn’t use this approach to reflect every document change in the image shown in the panel.

1 Like