Skip to main content
photogyulai
photogyulai
Inspiring
November 13, 2015
Answered

How to open a file in Photoshop with javascript

  • November 13, 2015
  • 5 replies
  • 43698 views

HI!

I want to open a file/image with a button click in an extension, in photoshop >> javascript. 

Possibly with relative path  to the extension file (it have to work on several different computers)

I tried several scripts:

===================================================================================

function somename(){





#target photoshop




var fileRef = "C:\\Users\\Username\\Desktop\\scripting\\image.png"     // I tried several differnet syntay about the path >> / \  \\ etc. etc.




var doc = open(fileRef);


}

================  OR  ==================================================================

function somename2(){





#target photoshop




var fileRef = new File( ~/desktop/scripting/image.png )     // I tried several differnet syntay about the path >> / \  \\ etc. etc.




app.open(fileRef)


}

======================================================

I know these paths are absolute but >> None of them had work so far


Any ideas?


ps: im new to this >> please be specific or provide some example 🙂  thanks!

This topic has been closed for replies.
Correct answer photogyulai

Hi,

If you are working in an HTML Panel, I'm afraid that $.fileName won't work (at least in Photoshop, possibly it's different in InDesign).

You need to pass down to the JSX the extension's path from the JS.

// JS


var csInterface = new CSInterface();


var extensionPath = csInterface.getSystemPath(SystemPath.EXTENSION);


var imagePath = extensionPath + "/img/myImage.png";


csInterface.evalScript("openFile('" + imagePath + "')");




//JSX


function openFile(imagePath) {


app.open(File(imagePath));


}

The path is relative to the Extension's root, and please note the extra quotes.

Hope this helps.

Davide Barranca

---

www.davidebarranca.com

www.cs-extensions.com


okay a little update!
Thanks Davide!

this works >> just i was a little to beginner to correctly interpret Davide answer.

So i put these code to the main.js file inside the JS folder: 

(function () {


    'use strict';


    var csInterface = new CSInterface();  


    function init() {


              


        themeManager.init();


              


        $("#something_1").click(function () {


  var csInterface = new CSInterface();


  var extensionPath = csInterface.getSystemPath(SystemPath.EXTENSION);


  var imagePath = extensionPath + "/image/samplepicture.jpg";


  csInterface.evalScript("openFile('" + imagePath + "')");


        });


    }    


    init();


}());

And this is the hostscript.jsx, inside JSX folder:

function openFile(imagePath) {


app.open(File(imagePath));


}

And the index.html call this whole thing like this:

<body class="hostElt">

  <table width="200" border="0" align="center" cellpadding="5">

      <tr>

        <td><button class="button_css" id="something_1">Button Text</button></td>

      </tr>

    </table>

    <script src="js/libs/CSInterface.js"></script>

    <script src="js/libs/jquery-2.0.2.min.js"></script>

    <script src="js/themeManager.js"></script>

    <script src="js/main.js"></script>

 

    <script src="jsx/hostscript.jsx"></script>
</body>

A very big thanks for everybody who helped!!! Take Care!

Ben

5 replies

T
thejoed1
Known Participant
October 4, 2017

Hello and thanks for your time beforehand,

I'm new to Javascript and scripting for Photoshop. I'm trying to understand how to open a psd file using Javascript and cannot figure it out.

The code I'm working with is below:

=============================

//OPEN A FILE ON A MAC

//Not clear on the correct syntax structure to target a file

var fileRef = File(app.path + "/file.psd")

//Open the file at the path specified above

if (fileRef.exists){ 

    var docRef = app.open(fileRef); 

}

//If the file above does not exsist show this

else{alert("File does not exsist.");}

=============================

The "/file.psd" part is my snag, I think.

What is the correct way to target the file?

Is it best to use a relative or absolute path?

Is a relative path based on the location of the script?

I know that with html one can target using"../../directory/file.jpg" and is that how Javascript works? I can't find any documentation that addresses this.

Any help is appreciated,

~ Joe D

JJMack
Community Expert
JJMackCommunity Expert
Community Expert
October 5, 2017

Joe

alert(app.path);

You will see app.path is Photoshop path  did you put a "file.psd" in it? I use CC 2014

also not the encoding / and %20 file coding is a bit strange consult the manuals

Adobe Photoshop Scripting

TOOL Guide

Absolute and relative path names

An absolute path name in URI notation describes the full path from a root directory down to a specific file

or folder. It starts with one or two slashes (/), and a slash separates path elements. For example, the

following describes an absolute location for the file myFile.jsx:

Int the Definitive JavaScript look up  decodeURI(

JavaScript decodeURI() Function

so then

alert(decodeURI(app.path));

JJMack
T
thejoed1
Known Participant
October 5, 2017

Hello,

Yes, I did. Does your response mean that app,path is only looking for a

Photoshop file, or any valid file?

Thanks

wipharatw46990280
wipharatw46990280
Participant
September 17, 2016

I try this from upper. when click index for run. debugger chrome show error below.

I don't know. I ' m wrong.

Please helps.

X
xbytor2
Inspiring
November 14, 2015

var sfile = File($.fileName);

var imageFolder = Folder(sfile.parent.parent + "/image");

var image = File(imageFolder + "/image.png");

This should work. If it doesn't, step through it with the ESTK debugger and check the intermediate values

to see if you can make sense of what's going on.

    photogyulai
    photogyulaiAuthor
    Inspiring
    November 13, 2015

    I found another script what is working. It is very specific about the path ( and " and / characters!

    So here another working version:

    function soemthing(){

    #target photoshop

    var myDoc = app.open(File("/c/Users/username/Desktop/scripting/image.png"));

    }

    still strugeling about the make it relative the jsx file

    X
    xbytor2
    Inspiring
    November 13, 2015

    Here are a couple more to ponder.

    File(Folder.desktop + "/image.png");

    File(File($.fileName).parent.parent + "/image.png");

      photogyulai
      photogyulaiAuthor
      Inspiring
      November 14, 2015

      okay thanks! didnt have luck yet!

      see the file structure:

      im using this code:

      //=====================================

      var relativePath = $.fileName + "../image/picture.png";    // (but i tried + "/../image/etc. also)

       

      app.open( new File( relativePath ) ); 

      //======================================

      not working yet, im guess i do something wrong ?!?!?

      ps: inside the "content" folder there is a example.html file >> this html contains the button, wich trigger the javascript.... im guess the code  should be relative to the jsx, but i tried relative to the html and did not work either.

      (works fine with absolute path)

      uberplugins
      uberplugins
      Inspiring
      November 13, 2015
      var fileRef = "C:/myImage.jpg";
      

      app.open( new File( fileRef ) );

      or

      var fileRef = new File("C:/myImage.jpg");
      

      app.open( fileRef ); 
        photogyulai
        photogyulaiAuthor
        Inspiring
        November 13, 2015

        thanks for that Nemo! it works!
        any ideas to make it relative path to the .jsx file ?!

        uberplugins
        uberplugins
        Inspiring
        November 13, 2015
        // path to current JSX file
        alert( $.fileName );
        

        

        // path to folder of this JSX file
        alert( (new File($.fileName)).parent );
          Terms & ConditionsAccessibility statement
          Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices