Dialog-based frame script
Copy link to clipboard
Copied
I decided I needed to have frames on my photographs before uploading them to my web site. So, I found a frame action, and figured out how to adjust it for my needs. But then I found that actions are far too inflexible and far too hard to edit. So, I learned how to use JavaScript, and created a dialog-based framing script. A sample can be seen here. The script files and documentation can be downloaded from GitHub.
If you find a problem or if you would like to see an improvement, let me know here or post an issue in GitHub.
Explore related tutorials & articles
Copy link to clipboard
Copied
Your readme
# Frame-With-UI
A PhotoShop action can be handy, but it is severely limited. Most choices are pre-made. If any choices can be made as the action is running, they can only be made one at a time. There is no way to save choices for future use. Editing actions is an extremely cumbersome process.
PhotoShop has the ability to run scripts written in JavaScript, and those scripts can have dialog boxes in which users can make selections before the script begins applying choices to the image. The Frame With UI (user interface) script is an example. All parameters of the frame can be selected before the frame is generated. If you don't like how the frame looks, you can click "Reset Frame" to restore the image to its original appearance. Frame styles can be saved, and previosly saved styles can be loaded.
To install this script, extract the files from the zip file into a location of your choice. To use the script, select File | Scripts ! Browse... and select FrameWithUI.jsx. You don't need to install them into your PhotoShop folder, but it may make it easier for PhotoShop to find it or remember it if you do. On my computer, that folder is C:/Program Files/Adobe/Adobe PhotoShop 2021/Presets/Scripts. To use the script in PhotoShop, select File | Scripts | Browse... and select the FrameWithUI.jsx file.
It is possible that saving frame styles may require you to make the Scripts folder writable by all users of your computer. The XML file that stores the styles gets written into that folder. Because I made my folder writable early in the process of developing this script, I do not yet know if the script will run with that folder having its default security settings.
Detailed documentation can be found in the zip file (once I write it).
However on mt Windows 10 PS 22.1.1 PS 2021 thet is nos sucj script and neither of the two jsx script open a dialog??
Copy link to clipboard
Copied
Thank you for pointing out that the readme file needs to be updated. I have removed the zip file from the GitHub archive and replaced it with individual files. You will need to copy the .js and .jsx files into the PhotoShop scripts folder yourself. You may need to change permissions on that folder to do so. Also, the GitHub repository now includes a detailed documentation file.
Copy link to clipboard
Copied
I do not install Photoshop Scripts into Adobe Photoshop versions folders. I link Adobe Photoshop versions Presets Scripts folder to my Photoshop Scripts tree. All versions of Photoshop use my scripts from my Photoshop Scripts tree. I have 8 versions of Photoshop installed. I'll Look at the code in your Scripts if the includes statement fail the work.
Copy link to clipboard
Copied
Script Code seems to get to
FrameDialog.prototype.CreateDialog = function()
that has the long commented code for
/*Code for Import https://scriptui.joonas.me — (Triple click to select): .... */
No dialog is displayed the script just end execution the execution never get to
var frameStylesList;
The File on GitHub have not been changed the zip file is still there and the read me still has the wrong script name documented.
Copy link to clipboard
Copied
I think you need to refresh your GitHub screen. I have removed the zip file.
If you do not install the script into the PhotoShop scripts folder, you will not be able to save frame styles. The script stores the styles in an XML file in your PhotoShop script folder. I realize that is less flexible than I would like, but I could not come up wiht an alternative location that the script would know when it starts running. If you want, you could examine the code and change the hard-coded location of that file.
Copy link to clipboard
Copied
I have just tested the frame script outside of my PhotoShop scripts folder, and everything worked as expected. I seem to have been borrowing trouble I didnt' need to. I will update the documentation accordingly.
Copy link to clipboard
Copied
I have even deleted all that I downloaded from GitHub and purged] Chrome cash and I refresh the GitHub Page. All I see is what was there in the past and when I download the code it still the zip file and when extracted to my scripts folder and start Photoshop the dialog does not open.
It look like in my part of the www your stuff is not being purged and updated or refreshed.
Copy link to clipboard
Copied
Even when I copy your files into PS 22.1.1 Presets\scripts the dialog does not open
Copy link to clipboard
Copied
When I created the GitHub repository, I zipped up the script files and uploaded to the repository. That was unnecessary. As you can see from the screenshot you posted, the zip file is no longer part of the repository.
When you download from a repository, GitHub delivers the files to you in a zip file it creates. You will need to unzip that file and copy the files into your target folder.
I am new to GitHub, and I may not be doing things correctly. I just tried to upload fresh copies of the files to GitHub. That message should not be there. I will download the files and make sure they're up to date.
Copy link to clipboard
Copied
I downloaded the files from GitHub and tested them. That message box did not appear.
Copy link to clipboard
Copied
JJ,
I have verified that the folder into which you put the files does not matter, I have not been able to get the styles file (frameStyles.xml) to be anyplace but the PhotoShop scripts file. Therefore, if you are going to be saving frame styles, you will either have to save them separately for every version of PhotoShop you use, or you are going to have to copy frameStyles.xml to your various script folders yourself.
I suppose it's possible to add an element to framestyles.XML named StylesFile, something like this:
<FrameStyles>
<StylesFile name="c:/MyScripts/FrameStyles.xml" />
</FrameSytles
That file would have to be in each scripts folder you might be using. Do you think there are likely to be many people using multiple versions of PhotoShop as you do?
Thanks very much for your interest in my script and your feedback.
Rob
Copy link to clipboard
Copied
JJ,
There's another problem with not having the frame script in the main PhotoShop scripts folder: I haven't found a good way to configure shortcut keys for it. If it is the main scripts folder, it will appear in the dropdown list of available scripts, and you can use the standard keyboard shortcuts tool to assign a shortcut for it. If you don't want it in the main scripts folder, the other option is to create an action to invoke the script. The problem here is that the result of an action doesn't appear until the action is finished running. One of my goals in developing the frame script was to be able to see the script before the dialog closes, so you can tell if anything needs to be changed and then make the change immediately. You can't do that if the script is called from an action.
Rob
Copy link to clipboard
Copied
As I wrote when I copied your files into Photoshop 22.1.1 Presets\Scrpts and start Photoshop your scripts FrameDialog.jsx FrameStylesDialog.jsx fail to show a dialog. My User access would also not have write access to the Presets Scripts folder:
"C:\Program Files\Adobe\Adobe Photoshop 2021\Presets\Scripts"
I now see a new script you have now add today FrameWithUI.jsx . So I create a folder in my scripts tree and downloaded you file one at a time into it . That script FrameWithUI.jsx does open a Dialog.
Copy link to clipboard
Copied
You may want to add a View Fit on Display when I tried your Script the add frame was partly off screen I could not see the boarder on the bottom with the text you added. I had to reset and cancel out of your script. zoom out then I could Play with your Script. The Idea of being able to create styles is a good I would suggest creating a folder in the users application data area. For My scripts I save files in "C:\Users\Uuser ID)\AppData\Roaming\JJMack's Scripts\" Or in a documents meta data for document specific information. Save your XML where users have write access. I have several version of Photoshop Installed. All version use a common copy of my scripts. So all Photoshop version will use the same save data. I do no save data for each Photoshop version installed.
I find the other Photoshop Frame script on the Web "FrameShop" may be more suited for most user for it will resize the framed image to fit with a Web Page It Has Fit Image type of resize settings And supports batching.
frameshop script v1 0 0 for photoshop cc and cs6
Copy link to clipboard
Copied
JJ,
Thanks very much for the suggestion about the AppData folder. That's a much better place for the styles file than the PhotoShop scripts folder since, as you say, it's always going to be there and always writable. Do you know if there's a corresponding folder on Mac machines?
I've seen the frame expand beyond the visible area. A "Fit on Screen" option would be nice. I don't know how to script that, though. It probably wouldn't be hard to find out.
I designed this for the user to create a frame and then adjust it before closing the dialog, thinking that different images may well need different settings. Batch processing would not fit that workflow. The frames would be reasonable but possibly not ideal, and individual files may need to be revisited. But I'll keep the possibility in mind in case I learn that there is a demand for the feature.
Rob
Copy link to clipboard
Copied
I do not use Frame Shop for they are save jsxbin I do not install JSXBIN Script for I can not see all they do, And I do not crack them for the Author is trying to keep their code private and I respect that. My Script seem to work on both PC and Mac. Here is the File path I use that works on both platforms " ~/Application Data"
var paramsFolder = new Folder( "~/Application Data/JJMack's Scripts/" + gScriptName );
Copy link to clipboard
Copied
What operating system are you using? I've never seen the ~ character in a file or folder name before. A quick Google search told me that the ~ character refers to a user's home directory in Unix/Linux systems, which should also include Macs, since Apple operating systems are based on Unix. I don't know if it's available on Windows systems. In Windows, I should be able to use %APPDATA% or %LOCALAPPDATA%. I haven't played with it yet, though.
Thanks again for your help!
Rob
Copy link to clipboard
Copied
There are special file coding conversion in Adobe Photoshop scripting documentation. There are special name constants to make coding between the two platform easier to do be platform independent. I believe it in the "JavaScript-Tools-Guide-CC.pdf" . Where Script UI is also documented. I only hack at Photoshop Scripting. I do not know JavaScript and can't touch type. I know thing like URI file coding exists and the are many file encoding standards. Much of the code in my scripts is cut and pasted and massage code, I can hack I can not type. From code I have seen or documentation I have read I may know I can use Folder.temp in a path and that will access a file in a users system temp on either platform. I also know the are system environment variable like %PATH% you can use. What I use may depend more on whose code I copied from. "Application Data" may be an alias for %APPDATA% on windows and a alias on a Mac for whatever. I may also be able to use Folder.appdata for all I know. Sometime I may just try something I think may work. Sometimes I get lucky. I'm 80 I have forgotten more than I ever knew.

